Bootstrap

SSM练手项目——米米商城后台管理

米米商城后台管理系统

1.项目简介

本项目为Spring,SpringMvc,Mybatis框架整合,用到的其他技术主要有jsp,BootStrap,JavaScript,ajax,jquery等等(没有学习BootStrap的同学是可以做的,但是如果没有学习过ajax和jQuery的建议先了解一下这两个前端技术,尤其是ajax)

同时此项目还用到了MD5密码加密操作,进行图片上传的时候用到了uuid随机生成上传图片名,防止传入同一个图片造成图片名的冲突。

本项目事务处理使用的是Spring事务处理的注解事务处理(@Transactional注解)

声明:本项目源于某站米米商城SSM项目,所讲到的功能已经基本实现,大家可以作为学习参考,有什么不懂的可以互相讨论下

2.项目分析及运行截屏

项目实现的是商品管理模块

项目所用到的jsp文件在webapp的admin目录下

项目整体效果:

 

登录页面-->login.jsp 

商品管理主页面-->product.jsp (使用的是html的iframe布局,页面右侧是product.jsp)

主页面说明:

这里有一个小细节商品类型选择框中的商品类型可以直接在product.jsp以及update.jsp,addProduct.jsp和Product.jsp中进行显示

,是因为把商品类型typeList通过监听器ServletContextListener放入到了servletContext域中,所以是都可访问到的,以下是监听器代码

/**
 * 全局监听器 , 项目启动的时候监听器触发
 */
@WebListener//注册监听器
public class ProductListener implements ServletContextListener {


    public void contextInitialized(ServletContextEvent servletContextEvent) {
        //注意因为和spring容器实现ServletContextListener冲突,不一定那个先执行,因此手工创建
        //手工从容器中取出ProductTypeServiceImpl对象
        ApplicationContext context = new ClassPathXmlApplicationContext("applicationContext_*.xml");
        //这里不能写成实现类需要写成接口
        ProductTypeService productTypeServiceImpl = (ProductTypeService) context.getBean("productTypeServiceImpl");
        //获取所有的商品类别
        List<ProductType> typeList = productTypeServiceImpl.getAll();
        //放入全局应用作用域中,供修改页面,新增页面,前台页面查询功能提供全部商品类别集合
        servletContextEvent.getServletContext().setAttribute("typeList",typeList);

    }
    public void contextDestroyed(ServletContextEvent servletContextEvent) {
    }
}

主页面的条件查询中主要使用的就是Mybatis的动态sql,进行条件的判断,在价格查询中,如果只是填写最低价格或者是最高价格那么会显示大于最低价格或者小于最高价格进行商品的展示,如果同时填入最低价格和最高价格那么会按照这个区间进行查询

主页面的分页按钮"<<"和">>" 我使用过jsp中的jstl标签中的if标签做了处理,当页数是最后一页的时候点击">>"的时候会自动跳转到第一页,当页数为第一页的时候,点击"<<"会自动跳转到最后一页

当编辑完成以及删除完成,如果是在条件查询后进行的编辑和删除会跳转到当前查询条件的当前页码

 

添加商品页面-->addProduct.jsp

 这里的类型仍然使用到是ServletContext中的typeList

这里的图片介绍使用到了ajax异步上传图片

文件上传以及回显的顺序如下:

使用ajaxfileupdateload.js进行文件的上传-->上传到服务器(服务器端需要配置好文件上传组件CommonsMultipartResolver)-->通过uuid对文件名进行处理并且将图片保存到服务器端,之后将文路径响应到jsp页面进行图片的回显

 

 更新商品页面-->update.jsp

 

 

          


 

;