ext springmvc mysql_基于ExtJs6前台,SpringMVC-Spring-Mybatis,resteasy,mysql无限极表设计,实现树状展示数据(treepanel)...

先从后台讲起

1.表的设计

20180111002230878367.png

2.mysql查询很容易,关键是要把id,text,parentId查出来

/p>

"http://mybatis.org/dtd/mybatis-3-mapper.dtd">

SELECT

bp.id,

bb.`name` brandName,

bp.`name` text,

bp.photo_url photoUrl,

bp.number,

bp.add_time addTime,

bp.modify_time modifyTime,

bp.parent_id parentId,

bp.photo_number photoNumber,

bp.`description`,

bp.`condition`,

bp.specification,

bp.version_name versionName

FROM

bs_photo bp INNER JOIN bs_brand bb ON bp.brand_id = bb.id

3.dao层

packagecom.xgt.dao.bs;importcom.xgt.bean.bs.PhotoBean;importcom.xgt.dao.entity.bs.Photo;importorg.jboss.resteasy.annotations.Query;importorg.mybatis.spring.SqlSessionTemplate;importorg.springframework.beans.factory.annotation.Autowired;importorg.springframework.beans.factory.annotation.Qualifier;importorg.springframework.stereotype.Repository;importjava.util.List;/*** Created by Administrator on 2017/8/21.*/@Repositorypublic classPhotoDao {

@Autowired

@Qualifier("sqlSession")privateSqlSessionTemplate sqlSession;public ListqueryPhoto(PhotoBean photoBean){return sqlSession.selectList("bs.photo.queryPhoto",photoBean);

}

}

4.service逻辑层

关键逻辑在buildPhoto方法和getChildren方法,这里用了lamda表达式,lamda表达式可以参考我的博客:http://www.cnblogs.com/Java-Starter/p/7424229.html

packagecom.xgt.service.bs;importcom.xgt.bean.bs.PhotoBean;importcom.xgt.dao.bs.PhotoDao;importcom.xgt.dao.entity.bs.Brand;importcom.xgt.dao.entity.bs.Photo;importorg.apache.commons.collections.map.HashedMap;importorg.springframework.beans.factory.annotation.Autowired;importorg.springframework.stereotype.Service;importjava.util.ArrayList;importjava.util.List;importjava.util.Map;/*** Created by Administrator on 2017/8/21.*/@Servicepublic classPhotoService {

@AutowiredprivatePhotoDao photoDao;private ListphotoList;public ListqueryPhotoArborescence(PhotoBean photoBean){

photoList=photoDao.queryPhoto(photoBean);returnbuildPhoto();

}/*** 构建资源数

*@returnlist*/

public ListbuildPhoto() {

List target = new ArrayList<>();if (!photoList.isEmpty()) {//根元素

photoList.stream().filter(photo -> photo.getParentId() == 0).forEach(photo -> { //根元素

List children =getChildren(photo);

photo.setChildren(children);

target.add(photo);

});

}returntarget;

}private ListgetChildren(Photo photo) {

List children = new ArrayList<>();if (!photoList.isEmpty()) {

photoList.stream().filter(child-> photo.getId().equals(child.getParentId())).forEach(child ->{

List tmp =getChildren(child);

child.setChildren(tmp);if(tmp.isEmpty()) {

child.setLeaf(true);

}

children.add(child);

});

}returnchildren;

}

}

5.Controller层

没什么操作

packagecom.xgt.controller;importcom.xgt.bean.bs.BrandBean;importcom.xgt.bean.bs.PhotoBean;importcom.xgt.common.BaseController;importcom.xgt.common.PcsResult;importcom.xgt.dao.entity.bs.Photo;importcom.xgt.exception.EnumPcsServiceError;importcom.xgt.service.bs.PhotoService;importorg.apache.shiro.authz.annotation.RequiresPermissions;importorg.jboss.resteasy.annotations.Form;importorg.springframework.beans.factory.annotation.Autowired;importorg.springframework.stereotype.Controller;import javax.ws.rs.*;importjavax.ws.rs.core.MediaType;importjava.util.List;importjava.util.Map;/*** Created by Administrator on 2017/8/28.*/@Controller

@Path("/photo")public class PhotoController extendsBaseController{

@AutowiredprivatePhotoService photoService;/*** 遍历商品树状结构

*@paramaccessToken

*@paramkeyWord

*@return

*/@GET

@Path("/queryPhotoArborescence")

@Produces(MediaType.APPLICATION_JSON)public PcsResult queryPhotoArborescence(@QueryParam("keyWord") String keyWord) {

PhotoBean photoBean= newPhotoBean();

photoBean.setKeyWord(keyWord);

List list =photoService.queryPhotoArborescence(photoBean);if(list.size()==0){return newResult(false);

}return newResult(true).setData(list);

}}

前台部分

1.model层

数据声明,便于查看有哪些数据,少一些数据不设置也可以

/**

* Created by C on 2017/08/05.*/Ext.define(‘Admin.model.photoArborescence.PhotoArborescence‘, {

extend:‘Admin.model.Base‘,

idProperty:‘id‘,

fields: [

{name:‘id‘, type: ‘int‘},

{name:‘name‘, type: ‘string‘},

{name:‘parentId‘, type: ‘int‘}

]

});

2.store层

和后台连接的桥梁

/**

* Created by Cjy on 2017/08/05.*/Ext.define(‘Admin.store.photoArborescence.PhotoArborescence‘, {

extend:‘Ext.data.TreeStore‘,

requires: [‘Common.Config‘],

storeId:‘photoArborescence.PhotoArborescence‘,

root: {

id:0,

text:‘效果图‘},

proxy: {

type:‘ajax‘,

api: {

read: Common.Config.requestPath(‘Photo‘, ‘queryPhotoArborescence‘)

},

reader: {

type:‘json‘,

rootProperty:‘data‘}

}

});

3.View层

/**

* Created by Cjy on 2017/5/23.*/Ext.define(‘Admin.view.photoArborescence.PhotoArborescence‘, {

extend:‘Ext.container.Container‘,

xtype:‘photoArborescence‘,

requires: [‘Ext.tree.Panel‘,‘Admin.view.photoArborescence.PhotoArborescenceController‘],

controller:‘photoArborescence‘,

layout:‘fit‘,

listeners: {

beforerender:‘pictureBeforeRender‘},

defaults: {

height:‘100%‘},

autoHeight :true,//自动高度,默认false

animate : true,//展开动画

enableDrag : true,//是否可以拖动(效果上)

enableDD : true,//不进可以拖动,还可以改变节点层次结构

enableDrop : false,//仅仅drop

rootVisible : true,//是否显示根节点,默认true

height : 150,

items: [{

title:‘自主报价管理‘,

xtype:‘treepanel‘,

reference:‘photoTree‘,

valueField:‘name‘,

useArrows:true,

autoScroll:true,

height:1150,

store:‘photoArborescence.PhotoArborescence‘}]

});

4.Controller层

js动作,执行前加载

/**

* Created by Cjy on 2017/5/23.*/Ext.define(‘Admin.view.photoArborescence.PhotoArborescenceController‘, {

extend:‘Admin.view.BaseViewController‘,

alias:‘controller.photoArborescence‘,/**

* 界面 渲染的时候加载 菜单 tree*/pictureBeforeRender:function() {var store = this.lookupReference(‘photoTree‘).getStore();

console.log(store);

store.getRoot().set(‘expanded‘, true);

store.load();

}

});

结果

20180111002230889110.png

原文:http://www.cnblogs.com/Java-Starter/p/7454548.html

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值