后台管理实现

learner

京淘后台管理实现

1.1 商品列表展现

1.1.1 商品POJO对象

image.png

1.1.2 表格数据页面结构

image.png

1.1.3 请求URL地址

说明:如果采用UI框架并且添加了分页插件,则会自动的形成如下的URL请求地址
image.png

1.1.4 编辑ItemController

image.png

1.1.5 编辑ItemService

image.png

1.1.6 编辑ItemMapper

手动编辑分页操作
image.png

1.2 MybatisPlus实现分页查询

1.2.1 编辑业务调用

image.png

1.2.2 编辑MybatisPlus配置类

说明:在jt-common中添加MP的配置文件

2.商品分类目录实现

2.1 封装POJO对象

image.png

2.2 页面JS引入过程

2.2.1 引入JS/CSS样式

image.png

2.2.2 引入common.jsp

image.png

2.3 数据格式化

2.3.1 格式化价格

image.png

2.3.2 格式化状态

image.png

2.4 格式化商品分类目录

2.4.1 页面结构分析

image.png

2.4.2 编辑ItemCatController

image.png

2.4.2 编辑ItemCatService

image.png

2.4.3 页面效果展现

image.png

2.4.3 ajax嵌套问题

说明: 如果在ajax内部再次嵌套ajax请求,则需要将内部的ajax请求设置为同步状态.
俗语: 赶紧走吧 赶不上二路公交车了…
核心原因: 页面需要刷新2次都是只刷新一次.

2.5 关于页面工具栏说明(看懂即可)

image.png

2.5.1 jQuery基本用法

1.选择器 在整个html页面 根据某些特定的标识 准确的定位元素的位置.

  1. Id选择器 $("#元素的Id")
  2. 元素(标签)选择器 $(“tr”)
  3. 类选择器 $(".class的名称") [{},{},{}]

3 商品分类目录树形结构展现

3.1 ItemCat表结构设定

问题分析: 商品分类信息一般分为3级. 问题: 如何确定父子级关系的呢??
答: 通过定义父级的字段实现
image.png

3.2 3级表数据的分析

说明:通过parentId 根据父级的ID查询所有的子级信息. 当查询一级菜单时parentId=0;
image.png

3.3 EasyUI中树形结构说明

1.页面JS
image.png
2.返回值说明
image.png

3.4 封装树形结构VO对象

image.png

3.5 页面JS结构说明

image.png

3.6 异步树加载说明

树控件读取URL。子节点的加载依赖于父节点的状态。当展开一个封闭的节点,如果节点没有加载子节点,它将会把节点id的值作为http请求参数并命名为’id’,通过URL发送到服务器上面检索子节点。
image.png

3.7 编辑ItemCatController

image.png

3.8 编辑ItemCatService

image.png

3.9页面效果展现

image.png

阅读 127
1 声望
0 粉丝
0 条评论
1 声望
0 粉丝
宣传栏