当前位置: 代码迷 >> 综合 >> Jpa + EasyUI 递归构建 左侧商品分类菜单树(增加、删除分类;JsonArray 、JsonObject ...)
  详细解决方案

Jpa + EasyUI 递归构建 左侧商品分类菜单树(增加、删除分类;JsonArray 、JsonObject ...)

热度:74   发布时间:2023-11-24 03:38:41.0

一、效果展示:

在这里插入图片描述

二、分类菜单树代码实现:

1.页面:

<div data-options="region:'west',collapsible:false" style="width: 200px" title="商品类别" split=true><ul id="tree" class="easyui-tree" style="padding: 10px"></ul><div style="position:absolute;bottom:10px;left:15px"><a href="javascript:openGoodsTypeAddDialog()" class="easyui-linkbutton" iconCls="icon-add" >新增</a><a id="del" href="javascript:deleteGoodsType()" class="easyui-linkbutton" disabled=true iconCls="icon-remove">删除</a>	</div></div>
$(document).ready(function(){
    $("#tree").tree({
    lines:true,url:"/admin/goodsType/loadTreeInfo",onLoadSuccess:function(){
    $("#tree").tree("expandAll");},onClick:function(node){
    if(node.attributes.state==0){
     // 假如是叶子节点,删除按钮恢复可用$("#del").linkbutton("enable");}else{
    $("#del").linkbutton("disable");}}});});

2.后台实现:

/*** 根据父节点获取所有商品类别* @return* @throws Exception*/@RequestMapping("/loadTreeInfo")@RequiresPermissions(value={
    "商品管理","进货入库","退货出库","销售出库","客户退货"},logical=Logical.OR)public String loadTreeInfo() throws Exception{
    logService.save(new Log(Log.SEARCH_ACTION,"查询所有商品类别信息"));return getAllByParentId(-1).toString();}
/*** 根据父节点id获取商品所有类别集合* @param parentId* @return*/public JsonArray getAllByParentId(Integer parentId) {
    JsonArray jsonArray=this.getByParentId(parentId);for(int i=0;i<jsonArray.size();i++) {
    JsonObject jsonObject=(JsonObject) jsonArray.get(i);if("open".equals(jsonObject.get("state").getAsString())) {
    continue;}else {
    jsonObject.add("children", getAllByParentId(jsonObject.get("id").getAsInt()));}}return jsonArray;}
/** 获取同一层的子节点* 根据父节点查询所有子节点* @param parentId* @return*/public JsonArray getByParentId(Integer parentId) {
    List<GoodsType> goodsTypeList=goodsTypeService.findByParentId(parentId);JsonArray jsonArray=new JsonArray();for(GoodsType goodsType:goodsTypeList) {
    JsonObject jsonObject=new JsonObject();jsonObject.addProperty("id", goodsType.getId()); // 节点IdjsonObject.addProperty("text", goodsType.getName()); // 节点名称if(goodsType.getState()==1) {
      // state属性 当删除菜单时 要根据state判断 根节点不能删除jsonObject.addProperty("state", "closed");// 根节点}else {
    jsonObject.addProperty("state", "open"); // 叶子节点}jsonObject.addProperty("iconCls", goodsType.getIcon());// 节点图标//存放扩展属性JsonObject attributeObject=new JsonObject(); // 扩展属性attributeObject.addProperty("state", goodsType.getState());jsonObject.add("attributes", attributeObject);jsonArray.add(jsonObject);}return jsonArray;}

repository:

/*** 商品类别Repository接口* @author Administrator**/
public interface GoodsTypeRepository extends JpaRepository<GoodsType, Integer>{/*** 根据父节点查找所有子节点* @param parentId* @return*/@Query(value="select * from t_goodstype where p_id=?1",nativeQuery=true)public List<GoodsType> findByParentId(int parentId);
}

三、新增 、删除 分类

1.需要注意的几点:
a.如果没有选中菜单,默认新增的是一级目录,也就是根节点下面

b.如果选中了一个菜单,那就把选中的那个作为父结点,添加它的子分类;
如果被选中的节点原来是叶子结点,为它添加子节点后要修改它的状态

c.如果没有选中叶子结点,“删除”按钮置为失效状态

d.如果选中叶子结点,“删除”按钮置才可以被点击

e. 如果选中的是叶子结点,当且仅当该节点下没有商品时才可以删除该分类

f.如果删除的是叶子结点,删除之后,要修改被删节点的父结点的状态

2.新增分类:

在这里插入图片描述
A.页面:

<div id="dlg" class="easyui-dialog" style="width: 300px;height: 120px;padding: 10px 20px"closed="true" buttons="#dlg-buttons" data-options="onClose:function(){ $('#goodsTypeName').val(''); }"><form id="fm" method="post"><div>商品类别:&nbsp;<input type="text" id="goodsTypeName" name="goodsTypeName" class="easyui-validatebox" required="true"/></div></form></div>
function openGoodsTypeAddDialog(){
    $("#dlg").dialog("open").dialog("setTitle","新增商品类别");}function saveGoodsType(){
    if(!$("#fm").form("validate")){
    return;}var goodsTypeName=$('#goodsTypeName').val();var node=$("#tree").tree("getSelected"); // 获取选中节点var parentId;if(node==null){
    parentId=1;}else{
    parentId=node.id;}$.post("/admin/goodsType/save",{
    name:goodsTypeName,parentId:parentId},function(result){
    if(result.success){
    $("#tree").tree("reload");closeGoodsTypeDialog();}else{
    $.messager.alert("系统提示","提交失败,请联系管理员!");}},"json");}

B.后台:

/*** 添加商品类别* 新增的商品类别的id是自增的* @param name* @param parentId* @return* @throws Exception*/@RequestMapping("/save")@RequiresPermissions(value={
    "商品管理","进货入库","退货出库","销售出库","客户退货"},logical=Logical.OR)public Map<String,Object> save(String name,Integer parentId) throws Exception{
    Map<String,Object> resultMap=new HashMap<String,Object>();GoodsType goodsType=new GoodsType();goodsType.setName(name);goodsType.setpId(parentId);goodsType.setIcon("icon-folder");goodsType.setState(0);goodsTypeService.save(goodsType);//修改父结点的状态GoodsType parentGoodsType=goodsTypeService.findById(parentId);parentGoodsType.setState(1);goodsTypeService.save(parentGoodsType);logService.save(new Log(Log.ADD_ACTION,"添加商品类别信息:"+name));resultMap.put("success", true);return resultMap;}
/*** 用户Service实现类* @author Administrator**/
@Service("goodsTypeService")
public class GoodsTypeServiceImpl implements GoodsTypeService{
    @Resourceprivate GoodsTypeRepository goodsTypeRepository;@Overridepublic List<GoodsType> findByParentId(int parentId) {
    return goodsTypeRepository.findByParentId(parentId);}@Overridepublic void save(GoodsType goodsType) {
    goodsTypeRepository.save(goodsType);}@Overridepublic GoodsType findById(Integer id) {
    return goodsTypeRepository.findOne(id);}
}

3.删除分类
在这里插入图片描述

在这里插入图片描述
A.js代码:

function deleteGoodsType(){
    var node=$("#tree").tree("getSelected");//获取选中节点var id=node.id;$.post("/admin/goodsType/delete",{
    id:id},function(result){
    if(result.success){
    $("#tree").tree("reload");$("#del").linkbutton("disable");}else{
    $.messager.alert("系统提示",result.errorInfo);}},"json");}

B.后台:

/*** 商品类别删除* @param id* @return* @throws Exception*/@RequestMapping("/delete")@RequiresPermissions(value={
    "商品管理","进货入库","退货出库","销售出库","客户退货"},logical=Logical.OR)public Map<String,Object> delete(Integer id) throws Exception{
    Map<String,Object> resultMap=new HashMap<String,Object>();if(goodsService.findByTypeId(id).size() == 0) {
    GoodsType goodsType=goodsTypeService.findById(id);if(goodsTypeService.findByParentId(goodsType.getpId()).size()==1) {
    //当前被删节点的父结点只有他这一个孩子时,删除后 父结点变为子节点GoodsType parentGoodsType=goodsTypeService.findById(goodsType.getpId());parentGoodsType.setState(0);goodsTypeService.save(parentGoodsType);}logService.save(new Log(Log.DELETE_ACTION,"删除商品类别信息:"+goodsType));goodsTypeService.delete(id);resultMap.put("success", true);}else {
    resultMap.put("success", false);resultMap.put("errorInfo", "该类别下含有商品,不能删除!");}return resultMap;}
  相关解决方案