E-commerce project-full text search-ElasticSearch-Chapter One-Medium
E-commerce Project-Mall Business-Commodity Listing-Chapter Two-Medium
E-commerce Project-Mall Business-Home-Third Chapter-Medium
E-commerce Project-Performance Stress Test-Chapter Four-Medium
Article Directory
- 1: Integrate thymeleaf rendering page
- 2: Integrate dev-tools to render first-level classification data
- 3: Render secondary and tertiary classification data
- 4: nginx-building domain name access environment 1 (reverse proxy configuration)
- 5: nginx-building domain name access environment 2 (load balancing to gateway)
1: Integrate thymeleaf rendering page
Earlier, we wrote the product shelf function, so that we can click the product shelf button in the background to put it on the shelf.
Next, we develop the front-end interface of the entire mall, including the home page content, retrieval content, shopping cart, order, etc.,
in mall-product. The effect of non-separation.
Step 1: Import thymeleaf
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-thymeleaf</artifactId>
</dependency>
Step 2: Introduce homepage resources and write a web specifically to realize the function of page jump.
Successfully start the visit, the following page appears, success
2: Integrate dev-tools to render first-level classification data
Next, let’s develop the page jump function. At this time, we don’t need @restcontroller,
but @controller
mall-product
IndexController.
@Controller
public class IndexController {
@Autowired
CategoryService categoryService;
@GetMapping({
"/","/index.html"})
public String indexPage(Model model){
//todo 1:查出所有的1级分类
List<CategoryEntity> categoryEntities= categoryService.getLevel1Category();
model.addAttribute("categorys",categoryEntities);
return "index";
}
CategoryServiceImpl
public class CategoryServiceImpl extends ServiceImpl<CategoryDao, CategoryEntity> implements CategoryService {
@Override
public List<CategoryEntity> getLevel1Category() {
QueryWrapper<CategoryEntity> parent_cid = new QueryWrapper<CategoryEntity>().eq("parent_cid", 0);
List<CategoryEntity> categoryEntities = baseMapper.selectList(parent_cid);
return categoryEntities;
}
To use thymeleaf, add a namespace to thymeleaf
<html lang="en" xmlns:th="http://www.thymeleaf.org">
mall-product
index.html
<div class="header_banner">
<div class="header_main_left">
<ul th:each="category : ${categorys}">
<li>
<a href="#" class="header_main_left_a" ctg-data="3" th:attr="ctg-data=${category.catId}"><b th:text="${category.name}">家用电器</b></a>
</li>
</ul>
</div>
3: Render secondary and tertiary classification data
Let’s improve a function to display the second-level menu and the third-level menu in this first-level menu.
mall-product
vo
@Data
@NoArgsConstructor
@AllArgsConstructor
public class Catelog2Vo {
public String catalog1Id;//一级分类id
private List<Object> catalog3List;//三级子分类
private String id;
private String name;
@Data
@NoArgsConstructor
@AllArgsConstructor
public static class Catelog3Vo{
private String catalog2Id;//父分类,2级分类id
private String id;
private String name;
}
}
web
IndexController
@Controller
public class IndexController {
@Autowired
CategoryService categoryService;
//以json格式返回
@ResponseBody
@GetMapping("index/json/catalog.json")
public Map<String, List<Catelog2Vo>> getCatalogJson(){
Map<String, List<Catelog2Vo>> indexJson=categoryService.getCatalogJson();
return indexJson;
}
CategoryServiceImpl
@Override
public Map<String, List<Catelog2Vo>> getCatalogJson() {
//1:查出所有1级分类
List<CategoryEntity> level1Category = this.getLevel1Category();
//2:封装数据
Map<String, List<Catelog2Vo>> parent_cid = level1Category.stream().collect(Collectors.toMap(k -> k.getCatId().toString(), v -> {
// 1.每一个的一级分类,查到这个一级分类的二级分类
List<CategoryEntity> categoryEntities = baseMapper.selectList(new QueryWrapper<CategoryEntity>().eq("parent_cid", v.getCatId()));
//2:封装上面的结果
List<Catelog2Vo> catelog2Vos = null;
if (categoryEntities != null) {
catelog2Vos = categoryEntities.stream().map(item -> {
Catelog2Vo catelog2Vo = new Catelog2Vo(v.getCatId().toString(), null, item.getCatId().toString(), item.getName());
//1.给当前二级分类的三级分类封装成vo
List<CategoryEntity> level3Category = baseMapper.selectList(new QueryWrapper<CategoryEntity>().eq("parent_cid", item.getCatId()));
//2:封装成指定格式
if (level3Category!=null){
List<Catelog2Vo.Catelog3Vo> collect = level3Category.stream().map(items -> {
Catelog2Vo.Catelog3Vo catelog3Vo = new Catelog2Vo.Catelog3Vo(item.getCatId().toString(),items.getCatId().toString(),items.getName());
return catelog3Vo;
}).collect(Collectors.toList());
catelog2Vo.setCatalog3List(collect);
}
return catelog2Vo;
}).collect(Collectors.toList());
}
return catelog2Vos;
}));
return parent_cid;
}
4: nginx-building domain name access environment 1 (reverse proxy configuration)
Nginx- build a domain name access environment