how2j.cn

下载区
文件名 文件大小
请先登录 426k
增值内容 426k
426k
使用站长秘制下载工具
步骤 1 : 先运行,看到效果,再学习   
步骤 2 : 模仿和排错   
步骤 3 : 界面效果   
步骤 4 : Product   
步骤 5 : Review   
步骤 6 : ReviewDAO   
步骤 7 : ReviewService   
步骤 8 : OrderItemDAO   
步骤 9 : OrderItemService   
步骤 10 : ProductService   
步骤 11 : ForeRESTController.product()   
步骤 12 : product.html   
步骤 13 : productPage.html   
步骤 14 : imgAndInfo.html   
步骤 15 : productReview.html   
步骤 16 : productDetail.html   
步骤 17 : modal4login.html   

步骤 1 :

先运行,看到效果,再学习

edit
增值内容,请先登录
完整的 Springboot 模仿天猫项目,使用 Springboot 、Vue.js、shiro、redis、elasticsearch 等一整套技术栈, 从无到有涵盖全部129个知识点,564个开发步骤, 充实 Springboot 项目经验,为简历加上一个有吸引力的砝码.
增值内容,点击购买
使用爬虫已经被系统记录,请勿使用爬虫,增大封号风险。 如果是误封 ,请联系站长,谢谢
增值内容,请先登录
完整的 Springboot 模仿天猫项目,使用 Springboot 、Vue.js、shiro、redis、elasticsearch 等一整套技术栈, 从无到有涵盖全部129个知识点,564个开发步骤, 充实 Springboot 项目经验,为简历加上一个有吸引力的砝码.
增值内容,点击购买
使用爬虫已经被系统记录,请勿使用爬虫,增大封号风险。 如果是误封 ,请联系站长,谢谢
增值内容,请先登录
完整的 Springboot 模仿天猫项目,使用 Springboot 、Vue.js、shiro、redis、elasticsearch 等一整套技术栈, 从无到有涵盖全部129个知识点,564个开发步骤, 充实 Springboot 项目经验,为简历加上一个有吸引力的砝码.
增值内容,点击购买
使用爬虫已经被系统记录,请勿使用爬虫,增大封号风险。 如果是误封 ,请联系站长,谢谢
界面效果
增值内容,请先登录
完整的 Springboot 模仿天猫项目,使用 Springboot 、Vue.js、shiro、redis、elasticsearch 等一整套技术栈, 从无到有涵盖全部129个知识点,564个开发步骤, 充实 Springboot 项目经验,为简历加上一个有吸引力的砝码.
增值内容,点击购买
使用爬虫已经被系统记录,请勿使用爬虫,增大封号风险。 如果是误封 ,请联系站长,谢谢
package com.how2java.tmall.pojo; import java.util.Date; import java.util.List; import javax.persistence.Column; import javax.persistence.Entity; import javax.persistence.GeneratedValue; import javax.persistence.GenerationType; import javax.persistence.Id; import javax.persistence.JoinColumn; import javax.persistence.ManyToOne; import javax.persistence.Table; import javax.persistence.Transient; import org.springframework.data.elasticsearch.annotations.Document; import com.fasterxml.jackson.annotation.JsonIgnoreProperties; @Entity @Table(name = "product") @JsonIgnoreProperties({ "handler","hibernateLazyInitializer"}) @Document(indexName = "tmall_springboot",type = "product") public class Product { @Id @GeneratedValue(strategy = GenerationType.IDENTITY) @Column(name = "id") int id; @ManyToOne @JoinColumn(name="cid") private Category category; //如果既没有指明 关联到哪个Column,又没有明确要用@Transient忽略,那么就会自动关联到表对应的同名字段 private String name; private String subTitle; private float originalPrice; private float promotePrice; private int stock; private Date createDate; @Transient private ProductImage firstProductImage; @Transient private List<ProductImage> productSingleImages; @Transient private List<ProductImage> productDetailImages; @Transient private int reviewCount; @Transient private int saleCount; public int getId() { return id; } public void setId(int id) { this.id = id; } public Category getCategory() { return category; } public void setCategory(Category category) { this.category = category; } public String getName() { return name; } public void setName(String name) { this.name = name; } public String getSubTitle() { return subTitle; } public void setSubTitle(String subTitle) { this.subTitle = subTitle; } public float getOriginalPrice() { return originalPrice; } public void setOriginalPrice(float originalPrice) { this.originalPrice = originalPrice; } public float getPromotePrice() { return promotePrice; } public void setPromotePrice(float promotePrice) { this.promotePrice = promotePrice; } public int getStock() { return stock; } public void setStock(int stock) { this.stock = stock; } public Date getCreateDate() { return createDate; } public void setCreateDate(Date createDate) { this.createDate = createDate; } public ProductImage getFirstProductImage() { return firstProductImage; } public void setFirstProductImage(ProductImage firstProductImage) { this.firstProductImage = firstProductImage; } public List<ProductImage> getProductSingleImages() { return productSingleImages; } public void setProductSingleImages(List<ProductImage> productSingleImages) { this.productSingleImages = productSingleImages; } public List<ProductImage> getProductDetailImages() { return productDetailImages; } public void setProductDetailImages(List<ProductImage> productDetailImages) { this.productDetailImages = productDetailImages; } public int getReviewCount() { return reviewCount; } public void setReviewCount(int reviewCount) { this.reviewCount = reviewCount; } public int getSaleCount() { return saleCount; } public void setSaleCount(int saleCount) { this.saleCount = saleCount; } @Override public String toString() { return "Product [id=" + id + ", category=" + category + ", name=" + name + ", subTitle=" + subTitle + ", originalPrice=" + originalPrice + ", promotePrice=" + promotePrice + ", stock=" + stock + ", createDate=" + createDate + ", firstProductImage=" + firstProductImage + ", reviewCount=" + reviewCount + ", saleCount=" + saleCount + "]"; } }
增值内容,请先登录
完整的 Springboot 模仿天猫项目,使用 Springboot 、Vue.js、shiro、redis、elasticsearch 等一整套技术栈, 从无到有涵盖全部129个知识点,564个开发步骤, 充实 Springboot 项目经验,为简历加上一个有吸引力的砝码.
增值内容,点击购买
使用爬虫已经被系统记录,请勿使用爬虫,增大封号风险。 如果是误封 ,请联系站长,谢谢
package com.how2java.tmall.pojo; import java.util.Date; import javax.persistence.Column; import javax.persistence.Entity; import javax.persistence.GeneratedValue; import javax.persistence.GenerationType; import javax.persistence.Id; import javax.persistence.JoinColumn; import javax.persistence.ManyToOne; import javax.persistence.Table; import com.fasterxml.jackson.annotation.JsonIgnoreProperties; @Entity @Table(name = "review") @JsonIgnoreProperties({ "handler","hibernateLazyInitializer" }) public class Review { @Id @GeneratedValue(strategy = GenerationType.IDENTITY) @Column(name = "id") private int id; @ManyToOne @JoinColumn(name="uid") private User user; @ManyToOne @JoinColumn(name="pid") private Product product; private String content; private Date createDate; public int getId() { return id; } public void setId(int id) { this.id = id; } public String getContent() { return content; } public void setContent(String content) { this.content = content; } public Date getCreateDate() { return createDate; } public void setCreateDate(Date createDate) { this.createDate = createDate; } public User getUser() { return user; } public void setUser(User user) { this.user = user; } public Product getProduct() { return product; } public void setProduct(Product product) { this.product = product; } }
增值内容,请先登录
完整的 Springboot 模仿天猫项目,使用 Springboot 、Vue.js、shiro、redis、elasticsearch 等一整套技术栈, 从无到有涵盖全部129个知识点,564个开发步骤, 充实 Springboot 项目经验,为简历加上一个有吸引力的砝码.
增值内容,点击购买
使用爬虫已经被系统记录,请勿使用爬虫,增大封号风险。 如果是误封 ,请联系站长,谢谢
package com.how2java.tmall.dao; import java.util.List; import org.springframework.data.jpa.repository.JpaRepository; import com.how2java.tmall.pojo.Product; import com.how2java.tmall.pojo.Review; public interface ReviewDAO extends JpaRepository<Review,Integer>{ List<Review> findByProductOrderByIdDesc(Product product); int countByProduct(Product product); }
package com.how2java.tmall.dao;
 
import java.util.List;

import org.springframework.data.jpa.repository.JpaRepository;

import com.how2java.tmall.pojo.Product;
import com.how2java.tmall.pojo.Review;

public interface ReviewDAO extends JpaRepository<Review,Integer>{

	List<Review> findByProductOrderByIdDesc(Product product);
	int countByProduct(Product product);

}
增值内容,请先登录
完整的 Springboot 模仿天猫项目,使用 Springboot 、Vue.js、shiro、redis、elasticsearch 等一整套技术栈, 从无到有涵盖全部129个知识点,564个开发步骤, 充实 Springboot 项目经验,为简历加上一个有吸引力的砝码.
增值内容,点击购买
使用爬虫已经被系统记录,请勿使用爬虫,增大封号风险。 如果是误封 ,请联系站长,谢谢
package com.how2java.tmall.service; import java.util.List; import org.springframework.beans.factory.annotation.Autowired; import org.springframework.cache.annotation.CacheConfig; import org.springframework.cache.annotation.CacheEvict; import org.springframework.cache.annotation.Cacheable; import org.springframework.stereotype.Service; import com.how2java.tmall.dao.ReviewDAO; import com.how2java.tmall.pojo.Product; import com.how2java.tmall.pojo.Review; @Service public class ReviewService { @Autowired ReviewDAO reviewDAO; @Autowired ProductService productService; public void add(Review review) { reviewDAO.save(review); } public List<Review> list(Product product){ List<Review> result = reviewDAO.findByProductOrderByIdDesc(product); return result; } public int getCount(Product product) { return reviewDAO.countByProduct(product); } }
增值内容,请先登录
完整的 Springboot 模仿天猫项目,使用 Springboot 、Vue.js、shiro、redis、elasticsearch 等一整套技术栈, 从无到有涵盖全部129个知识点,564个开发步骤, 充实 Springboot 项目经验,为简历加上一个有吸引力的砝码.
增值内容,点击购买
使用爬虫已经被系统记录,请勿使用爬虫,增大封号风险。 如果是误封 ,请联系站长,谢谢
package com.how2java.tmall.dao; import java.util.List; import org.springframework.data.jpa.repository.JpaRepository; import com.how2java.tmall.pojo.Order; import com.how2java.tmall.pojo.OrderItem; import com.how2java.tmall.pojo.Product; import com.how2java.tmall.pojo.User; public interface OrderItemDAO extends JpaRepository<OrderItem,Integer>{ List<OrderItem> findByOrderOrderByIdDesc(Order order); List<OrderItem> findByProduct(Product product); }
package com.how2java.tmall.dao;

import java.util.List;

import org.springframework.data.jpa.repository.JpaRepository;

import com.how2java.tmall.pojo.Order;
import com.how2java.tmall.pojo.OrderItem;
import com.how2java.tmall.pojo.Product;
import com.how2java.tmall.pojo.User;

public interface OrderItemDAO extends JpaRepository<OrderItem,Integer>{
	List<OrderItem> findByOrderOrderByIdDesc(Order order);
	List<OrderItem> findByProduct(Product product);
}
增值内容,请先登录
完整的 Springboot 模仿天猫项目,使用 Springboot 、Vue.js、shiro、redis、elasticsearch 等一整套技术栈, 从无到有涵盖全部129个知识点,564个开发步骤, 充实 Springboot 项目经验,为简历加上一个有吸引力的砝码.
增值内容,点击购买
使用爬虫已经被系统记录,请勿使用爬虫,增大封号风险。 如果是误封 ,请联系站长,谢谢
package com.how2java.tmall.service; import com.how2java.tmall.dao.OrderItemDAO; import com.how2java.tmall.pojo.Order; import com.how2java.tmall.pojo.OrderItem; import com.how2java.tmall.pojo.Product; import org.springframework.beans.factory.annotation.Autowired; import org.springframework.stereotype.Service; import java.util.List; @Service public class OrderItemService { @Autowired OrderItemDAO orderItemDAO; @Autowired ProductImageService productImageService; public void fill(List<Order> orders) { for (Order order : orders) fill(order); } public void update(OrderItem orderItem) { orderItemDAO.save(orderItem); } public void fill(Order order) { List<OrderItem> orderItems = listByOrder(order); float total = 0; int totalNumber = 0; for (OrderItem oi :orderItems) { total+=oi.getNumber()*oi.getProduct().getPromotePrice(); totalNumber+=oi.getNumber(); productImageService.setFirstProdutImage(oi.getProduct()); } order.setTotal(total); order.setOrderItems(orderItems); order.setTotalNumber(totalNumber); order.setOrderItems(orderItems); } public void add(OrderItem orderItem) { orderItemDAO.save(orderItem); } public OrderItem get(int id) { return orderItemDAO.findOne(id); } public void delete(int id) { orderItemDAO.delete(id); } public int getSaleCount(Product product) { List<OrderItem> ois =listByProduct(product); int result =0; for (OrderItem oi : ois) { if(null!=oi.getOrder()) if(null!= oi.getOrder() && null!=oi.getOrder().getPayDate()) result+=oi.getNumber(); } return result; } public List<OrderItem> listByProduct(Product product) { return orderItemDAO.findByProduct(product); } public List<OrderItem> listByOrder(Order order) { return orderItemDAO.findByOrderOrderByIdDesc(order); } }
增值内容,请先登录
完整的 Springboot 模仿天猫项目,使用 Springboot 、Vue.js、shiro、redis、elasticsearch 等一整套技术栈, 从无到有涵盖全部129个知识点,564个开发步骤, 充实 Springboot 项目经验,为简历加上一个有吸引力的砝码.
增值内容,点击购买
使用爬虫已经被系统记录,请勿使用爬虫,增大封号风险。 如果是误封 ,请联系站长,谢谢
package com.how2java.tmall.service; import com.how2java.tmall.dao.ProductDAO; import com.how2java.tmall.pojo.Category; import com.how2java.tmall.pojo.Product; import com.how2java.tmall.util.Page4Navigator; import org.springframework.beans.factory.annotation.Autowired; import org.springframework.data.domain.Page; import org.springframework.data.domain.PageRequest; import org.springframework.data.domain.Pageable; import org.springframework.data.domain.Sort; import org.springframework.stereotype.Service; import java.util.ArrayList; import java.util.List; @Service public class ProductService { @Autowired ProductDAO productDAO; @Autowired CategoryService categoryService; @Autowired ProductImageService productImageService; @Autowired OrderItemService orderItemService; @Autowired ReviewService reviewService; public void add(Product bean) { productDAO.save(bean); } public void delete(int id) { productDAO.delete(id); } public Product get(int id) { return productDAO.findOne(id); } public void update(Product bean) { productDAO.save(bean); } public Page4Navigator<Product> list(int cid, int start, int size,int navigatePages) { Category category = categoryService.get(cid); Sort sort = new Sort(Sort.Direction.DESC, "id"); Pageable pageable = new PageRequest(start, size, sort); Page<Product> pageFromJPA =productDAO.findByCategory(category,pageable); return new Page4Navigator<>(pageFromJPA,navigatePages); } public void fill(List<Category> categorys) { for (Category category : categorys) { fill(category); } } public void fill(Category category) { List<Product> products = listByCategory(category); productImageService.setFirstProdutImages(products); category.setProducts(products); } public void fillByRow(List<Category> categorys) { int productNumberEachRow = 8; for (Category category : categorys) { List<Product> products = category.getProducts(); List<List<Product>> productsByRow = new ArrayList<>(); for (int i = 0; i < products.size(); i+=productNumberEachRow) { int size = i+productNumberEachRow; size= size>products.size()?products.size():size; List<Product> productsOfEachRow =products.subList(i, size); productsByRow.add(productsOfEachRow); } category.setProductsByRow(productsByRow); } } public List<Product> listByCategory(Category category){ return productDAO.findByCategoryOrderById(category); } public void setSaleAndReviewNumber(Product product) { int saleCount = orderItemService.getSaleCount(product); product.setSaleCount(saleCount); int reviewCount = reviewService.getCount(product); product.setReviewCount(reviewCount); } public void setSaleAndReviewNumber(List<Product> products) { for (Product product : products) setSaleAndReviewNumber(product); } }
步骤 11 :

ForeRESTController.product()

edit
增值内容,请先登录
完整的 Springboot 模仿天猫项目,使用 Springboot 、Vue.js、shiro、redis、elasticsearch 等一整套技术栈, 从无到有涵盖全部129个知识点,564个开发步骤, 充实 Springboot 项目经验,为简历加上一个有吸引力的砝码.
增值内容,点击购买
使用爬虫已经被系统记录,请勿使用爬虫,增大封号风险。 如果是误封 ,请联系站长,谢谢
@GetMapping("/foreproduct/{pid}") public Object product(@PathVariable("pid") int pid) { Product product = productService.get(pid); List<ProductImage> productSingleImages = productImageService.listSingleProductImages(product); List<ProductImage> productDetailImages = productImageService.listDetailProductImages(product); product.setProductSingleImages(productSingleImages); product.setProductDetailImages(productDetailImages); List<PropertyValue> pvs = propertyValueService.list(product); List<Review> reviews = reviewService.list(product); productService.setSaleAndReviewNumber(product); productImageService.setFirstProdutImage(product); Map<String,Object> map= new HashMap<>(); map.put("product", product); map.put("pvs", pvs); map.put("reviews", reviews); return Result.success(map); }
package com.how2java.tmall.web; import com.how2java.tmall.pojo.*; import com.how2java.tmall.service.*; import com.how2java.tmall.util.Result; import org.springframework.beans.factory.annotation.Autowired; import org.springframework.web.bind.annotation.*; import org.springframework.web.util.HtmlUtils; import javax.servlet.http.HttpSession; import java.util.HashMap; import java.util.List; import java.util.Map; @RestController public class ForeRESTController { @Autowired CategoryService categoryService; @Autowired ProductService productService; @Autowired UserService userService; @Autowired ProductImageService productImageService; @Autowired PropertyValueService propertyValueService; @Autowired OrderItemService orderItemService; @Autowired ReviewService reviewService; @GetMapping("/forehome") public Object home() { List<Category> cs= categoryService.list(); productService.fill(cs); productService.fillByRow(cs); categoryService.removeCategoryFromProduct(cs); return cs; } @PostMapping("/foreregister") public Object register(@RequestBody User user) { String name = user.getName(); String password = user.getPassword(); name = HtmlUtils.htmlEscape(name); user.setName(name); boolean exist = userService.isExist(name); if(exist){ String message ="用户名已经被使用,不能使用"; return Result.fail(message); } user.setPassword(password); userService.add(user); return Result.success(); } @PostMapping("/forelogin") public Object login(@RequestBody User userParam, HttpSession session) { String name = userParam.getName(); name = HtmlUtils.htmlEscape(name); User user =userService.get(name,userParam.getPassword()); if(null==user){ String message ="账号密码错误"; return Result.fail(message); } else{ session.setAttribute("user", user); return Result.success(); } } @GetMapping("/foreproduct/{pid}") public Object product(@PathVariable("pid") int pid) { Product product = productService.get(pid); List<ProductImage> productSingleImages = productImageService.listSingleProductImages(product); List<ProductImage> productDetailImages = productImageService.listDetailProductImages(product); product.setProductSingleImages(productSingleImages); product.setProductDetailImages(productDetailImages); List<PropertyValue> pvs = propertyValueService.list(product); List<Review> reviews = reviewService.list(product); productService.setSaleAndReviewNumber(product); productImageService.setFirstProdutImage(product); Map<String,Object> map= new HashMap<>(); map.put("product", product); map.put("pvs", pvs); map.put("reviews", reviews); return Result.success(map); } }
增值内容,请先登录
完整的 Springboot 模仿天猫项目,使用 Springboot 、Vue.js、shiro、redis、elasticsearch 等一整套技术栈, 从无到有涵盖全部129个知识点,564个开发步骤, 充实 Springboot 项目经验,为简历加上一个有吸引力的砝码.
增值内容,点击购买
使用爬虫已经被系统记录,请勿使用爬虫,增大封号风险。 如果是误封 ,请联系站长,谢谢
<!DOCTYPE html> <html xmlns:th="http://www.thymeleaf.org"> <head th:include="include/fore/header::html" ></head> <body> <div id="workingArea"> <div th:replace="include/fore/top::html" ></div> <div th:replace="include/fore/search::html" ></div> <div th:replace="include/fore/product/productPage::html" ></div> <div th:replace="include/fore/modal4login::html" ></div> <div th:replace="include/fore/footer::html" ></div> </div> </body> </html>
<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head th:include="include/fore/header::html" ></head>
<body>
<div id="workingArea">
    <div th:replace="include/fore/top::html" ></div>
    <div th:replace="include/fore/search::html" ></div>
    <div th:replace="include/fore/product/productPage::html" ></div>
    <div th:replace="include/fore/modal4login::html" ></div>
    <div th:replace="include/fore/footer::html" ></div>
</div>
</body>
</html>
步骤 13 :

productPage.html

edit
增值内容,请先登录
完整的 Springboot 模仿天猫项目,使用 Springboot 、Vue.js、shiro、redis、elasticsearch 等一整套技术栈, 从无到有涵盖全部129个知识点,564个开发步骤, 充实 Springboot 项目经验,为简历加上一个有吸引力的砝码.
增值内容,点击购买
使用爬虫已经被系统记录,请勿使用爬虫,增大封号风险。 如果是误封 ,请联系站长,谢谢
<div th:fragment="html"> <script> $(function(){ var pid = getUrlParms("pid"); var data4Vue = { uri:'foreproduct', p:'', category:null, firstProductImage:null, pvs:[], reviews:[], showDetail:true, showReview:false, user:{name:'', password:''} }; //ViewModel var vue = new Vue({ el: '#workingArea', data: data4Vue, mounted:function(){ //mounted 表示这个 Vue 对象加载成功了 linkDefaultActions(); this.load(); }, methods: { load:function(){ var url = this.uri+"/"+pid; axios.get(url).then(function(response) { var result = response.data; vue.p=result.data.product; vue.pvs=result.data.pvs; vue.reviews=result.data.reviews; vue.category = vue.p.category; vue.firstProductImage = vue.p.firstProductImage; vue.$nextTick(function(){ imgAndInfoPageRegisterListeners(vue); }) }); }, toggle2Detail:function(){ this.showDetail=true; this.showReview=false; }, toggle2Review:function(){ this.showDetail=false; this.showReview=true; } } }); }); </script> <title>模仿天猫官网 -- {{p.name}}</title> <div class="categoryPictureInProductPageDiv"> <img v-if="category!=null" class="categoryPictureInProductPage" :src="'img/category/'+category.id+'.jpg'"> </div> <div class="productPageDiv"> <div th:replace="include/fore/product/imgAndInfo::html" ></div> <div th:replace="include/fore/product/productReview::html" ></div> <div th:replace="include/fore/product/productDetail::html" ></div> </div> </div>
增值内容,请先登录
完整的 Springboot 模仿天猫项目,使用 Springboot 、Vue.js、shiro、redis、elasticsearch 等一整套技术栈, 从无到有涵盖全部129个知识点,564个开发步骤, 充实 Springboot 项目经验,为简历加上一个有吸引力的砝码.
增值内容,点击购买
使用爬虫已经被系统记录,请勿使用爬虫,增大封号风险。 如果是误封 ,请联系站长,谢谢
imgAndInfo.html
<div th:fragment="html"> <script> function imgAndInfoPageRegisterListeners(vue){ var stock = vue.p.stock; $(".productNumberSetting").keyup(function(){ var num= $(".productNumberSetting").val(); num = parseInt(num); if(isNaN(num)) num= 1; if(num<=0) num = 1; if(num>stock) num = stock; $(".productNumberSetting").val(num); }); $(".increaseNumber").click(function(){ var num= $(".productNumberSetting").val(); num++; if(num>stock) num = stock; $(".productNumberSetting").val(num); }); $(".decreaseNumber").click(function(){ var num= $(".productNumberSetting").val(); --num; if(num<=0) num=1; $(".productNumberSetting").val(num); }); $(".addCartButton").removeAttr("disabled"); $(".addCartLink").click(function(){ var url = "forecheckLogin"; axios.get(url).then(function(response) { if(0==response.data.code){ var pid = vue.p.id; var num= $(".productNumberSetting").val(); var url = "foreaddCart?pid="+pid+"&num="+num; axios.get(url).then(function(response) { var result = response.data; if(0==result.code){ $(".addCartButton").html("已加入购物车"); $(".addCartButton").attr("disabled","disabled"); $(".addCartButton").css("background-color","lightgray") $(".addCartButton").css("border-color","lightgray") $(".addCartButton").css("color","black") } }); } else{ $("#loginModal").modal('show'); } }); }); $(".buyLink").click(function(){ var url = "forecheckLogin"; axios.get(url).then(function(response) { if(0==response.data.code){ var pid = vue.p.id; var num= $(".productNumberSetting").val(); var url = "forebuyone?pid="+pid+"&num="+num; axios.get(url).then(function(response) { var oiid = response.data; location.href="buy?oiid="+oiid; }); } else{ $("#loginModal").modal('show'); } }); return false; }); $("button.loginSubmitButton").click(function(){ var url = "forelogin"; if(0==vue.user.name.length){ $("span.errorMessage").html("请输入用户名"); $("div.loginErrorMessageDiv").css("visibility","visible"); return; } if(0==vue.user.password.length){ $("span.errorMessage").html("请输入密码"); $("div.loginErrorMessageDiv").css("visibility","visible"); return; } axios.post(url,vue.user).then(function(response) { var result = response.data; if(result.code==0){ location.href="product?pid="+vue.p.id; } else{ $("span.errorMessage").html(result.message); $("div.loginErrorMessageDiv").css("visibility","visible"); } }); }); $("img.smallImage").mouseenter(function(){ var bigImageURL = $(this).attr("bigImageURL"); $("img.bigImg").attr("src",bigImageURL); }); $("img.bigImg").load( function(){ $("img.smallImage").each(function(){ var bigImageURL = $(this).attr("bigImageURL"); img = new Image(); img.src = bigImageURL; img.onload = function(){ $("div.img4load").append($(img)); }; }); } ); } </script> <div class="imgAndInfo"> <div class="imgInimgAndInfo"> <img v-if="firstProductImage!=null" :src="'img/productSingle/'+firstProductImage.id+'.jpg'" class="bigImg"> <div class="smallImageDiv"> <img v-for="pi in p.productSingleImages" :src="'img/productSingle_small/'+pi.id+'.jpg'" :bigImageURL="'img/productSingle/'+pi.id+'.jpg'" class="smallImage"> </div> <div class="img4load hidden" ></div> </div> <div class="infoInimgAndInfo"> <div class="productTitle"> {{p.name}} </div> <div class="productSubTitle"> {{p.subTitle}} </div> <div class="productPrice"> <div class="juhuasuan"> <span class="juhuasuanBig" >聚划算</span> <span>此商品即将参加聚划算,<span class="juhuasuanTime">1天19小时</span>后开始,</span> </div> <div class="productPriceDiv"> <div class="gouwujuanDiv"><img height="16px" src="img/site/gouwujuan.png"> <span> 全天猫实物商品通用</span> </div> <div class="originalDiv"> <span class="originalPriceDesc">价格</span> <span class="originalPriceYuan">¥</span> <span class="originalPrice"> {{p.originalPrice|formatMoneyFilter}} </span> </div> <div class="promotionDiv"> <span class="promotionPriceDesc">促销价 </span> <span class="promotionPriceYuan">¥</span> <span class="promotionPrice"> {{p.promotePrice|formatMoneyFilter}} </span> </div> </div> </div> <div class="productSaleAndReviewNumber"> <div>销量 <span class="redColor boldWord"> {{ p.saleCount }}</span></div> <div>累计评价 <span class="redColor boldWord"> {{ p.reviewCount }}</span></div> </div> <div class="productNumber"> <span>数量</span> <span> <span class="productNumberSettingSpan"> <input class="productNumberSetting" type="text" value="1"> </span> <span class="arrow"> <a href="#nowhere" class="increaseNumber"> <span class="updown"> <img src="img/site/increase.png"> </span> </a> <span class="updownMiddle"> </span> <a href="#nowhere" class="decreaseNumber"> <span class="updown"> <img src="img/site/decrease.png"> </span> </a> </span> 件</span> <span>库存{{p.stock}}件</span> </div> <div class="serviceCommitment"> <span class="serviceCommitmentDesc">服务承诺</span> <span class="serviceCommitmentLink"> <a href="#nowhere">正品保证</a> <a href="#nowhere">极速退款</a> <a href="#nowhere">赠运费险</a> <a href="#nowhere">七天无理由退换</a> </span> </div> <div class="buyDiv"> <a class="buyLink" ><button class="buyButton" >立即购买</button></a> <a href="#nowhere" class="addCartLink"><button class="addCartButton"><span class="glyphicon glyphicon-shopping-cart"></span>加入购物车</button></a> </div> </div> <div style="clear:both"></div> </div> </div>
步骤 15 :

productReview.html

edit
增值内容,请先登录
完整的 Springboot 模仿天猫项目,使用 Springboot 、Vue.js、shiro、redis、elasticsearch 等一整套技术栈, 从无到有涵盖全部129个知识点,564个开发步骤, 充实 Springboot 项目经验,为简历加上一个有吸引力的砝码.
增值内容,点击购买
使用爬虫已经被系统记录,请勿使用爬虫,增大封号风险。 如果是误封 ,请联系站长,谢谢
productReview.html
<div th:fragment="html"> <div class="productReviewDiv" v-show="showReview" > <div class="productReviewTopPart"> <a href="#nowhere" class="productReviewTopPartSelectedLink" @click="toggle2Detail">商品详情</a> <a href="#nowhere" class="selected">累计评价 <span class="productReviewTopReviewLinkNumber">{{p.reviewCount}}</span> </a> </div> <div class="productReviewContentPart"> <div class="productReviewItem" v-for="r in reviews"> <div class="productReviewItemDesc"> <div class="productReviewItemContent"> {{r.content }} </div> <div class="productReviewItemDate"> {{r.createDate|formatDateFilter('YYYY-MM-DD')}} </div> </div> <div class="productReviewItemUserInfo"> {{r.user.anonymousName}}<span class="userInfoGrayPart">(匿名)</span> </div> <div style="clear:both"></div> </div> </div> </div> </div>
步骤 16 :

productDetail.html

edit
增值内容,请先登录
完整的 Springboot 模仿天猫项目,使用 Springboot 、Vue.js、shiro、redis、elasticsearch 等一整套技术栈, 从无到有涵盖全部129个知识点,564个开发步骤, 充实 Springboot 项目经验,为简历加上一个有吸引力的砝码.
增值内容,点击购买
使用爬虫已经被系统记录,请勿使用爬虫,增大封号风险。 如果是误封 ,请联系站长,谢谢
productDetail.html
<div th:fragment="html"> <div class="productDetailDiv" v-show="showDetail" > <div class="productDetailTopPart"> <a href="#nowhere" class="productDetailTopPartSelectedLink selected">商品详情</a> <a href="#nowhere" class="productDetailTopReviewLink" @click="toggle2Review">累计评价 <span class="productDetailTopReviewLinkNumber">{{p.reviewCount}}</span> </a> </div> <div class="productParamterPart"> <div class="productParamter">产品参数:</div> <div class="productParamterList"> <span v-for="pv in pvs" >{{pv.property.name}}: {{pv.value | subStringFilter(0,10)}} </span> </div> <div style="clear:both"></div> </div> <div class="productDetailImagesPart"> <img v-for="pi in p.productDetailImages" :src="'img/productDetail/'+pi.id+'.jpg'"> </div> </div> </div>
<div th:fragment="html"> 
	<div class="productDetailDiv" v-show="showDetail" >
		<div class="productDetailTopPart">
			<a href="#nowhere" class="productDetailTopPartSelectedLink selected">商品详情</a>
			<a href="#nowhere" class="productDetailTopReviewLink" @click="toggle2Review">累计评价 <span class="productDetailTopReviewLinkNumber">{{p.reviewCount}}</span> </a>
		</div>

		<div class="productParamterPart">
			<div class="productParamter">产品参数:</div>
			<div class="productParamterList">
				<span v-for="pv in pvs" >{{pv.property.name}}: {{pv.value | subStringFilter(0,10)}} </span>
			</div>
			<div style="clear:both"></div>
		</div>
		
		<div class="productDetailImagesPart">
			<img v-for="pi in p.productDetailImages" :src="'img/productDetail/'+pi.id+'.jpg'">
		</div>
	</div>
</div>

步骤 17 :

modal4login.html

edit
增值内容,请先登录
完整的 Springboot 模仿天猫项目,使用 Springboot 、Vue.js、shiro、redis、elasticsearch 等一整套技术栈, 从无到有涵盖全部129个知识点,564个开发步骤, 充实 Springboot 项目经验,为简历加上一个有吸引力的砝码.
增值内容,点击购买
使用爬虫已经被系统记录,请勿使用爬虫,增大封号风险。 如果是误封 ,请联系站长,谢谢
<div th:fragment="html" class="modal " id="loginModal" tabindex="-1" role="dialog" > <div class="modal-dialog loginDivInProductPageModalDiv"> <div class="modal-content"> <div class="loginDivInProductPage"> <div class="loginErrorMessageDiv"> <div class="alert alert-danger" > <button type="button" class="close" data-dismiss="alert" aria-label="Close"></button> <span class="errorMessage"></span> </div> </div> <div class="login_acount_text">账户登录</div> <div class="loginInput " > <span class="loginInputIcon "> <span class=" glyphicon glyphicon-user"></span> </span> <input v-model="user.name" placeholder="手机/会员名/邮箱" type="text"> </div> <div class="loginInput " > <span class="loginInputIcon "> <span class=" glyphicon glyphicon-lock"></span> </span> <input v-model="user.password" type="password" placeholder="密码" type="text"> </div> <span class="text-danger">不要输入真实的天猫账号密码</span><br><br> <div> <a class="notImplementLink" href="#nowhere">忘记登录密码</a> <a href="register" class="pull-right">免费注册</a> </div> <div style="margin-top:20px"> <button class="btn btn-block redButton loginSubmitButton" type="submit">登录</button> </div> </div> </div> </div> </div>


HOW2J公众号,关注后实时获知布最新的教程和优惠活动,谢谢。


问答区域    
2019-04-11 为什么getSaleCount中要对遍历出来的订单项的对象进行两次有无订单的判断
lixinjia_65



为什么getSaleCount中要对遍历出来的订单项的对象进行两次有无订单的判断,直接写if(null!= oi.getOrder() && null!=oi.getOrder().getPayDate()) result+=oi.getNumber();不行吗
public int getSaleCount(Product product) {
		List<OrderItem> ois =listByProduct(product);
		int result =0;
		for (OrderItem oi : ois) {
			if(null!=oi.getOrder())
				if(null!= oi.getOrder() && null!=oi.getOrder().getPayDate())
					result+=oi.getNumber();
		}
		return result;
	}

							


1 个答案

how2j 答案时间:2019-04-11
因为没有订单的 orderItem 还在购物车里,这个不能算销量



回答已经提交成功,正在审核。 请于 我的回答 处查看回答记录,谢谢
答案 或者 代码至少填写一项, 如果是自己有问题,请重新提问,否则站长有可能看不到





2019-03-18 这一下出来的Review看不懂啊,希望能在代码前面标注一点解析
542560
同上




1 个答案

how2j 答案时间:2019-03-19
一下出来的 Review? 这步骤5,6,7 ,11 不都讲这个吗?你都不看? 一下子就跳过了吗?



回答已经提交成功,正在审核。 请于 我的回答 处查看回答记录,谢谢
答案 或者 代码至少填写一项, 如果是自己有问题,请重新提问,否则站长有可能看不到




2019-02-22 哪来的PropertyValueService
2019-02-11 首页跳转问题
2019-01-12 有2个type 你们哪个是怎么运行的 , 我的运行不了
2018-11-29 两个type




提问之前请登陆
提问已经提交成功,正在审核。 请于 我的提问 处查看提问记录,谢谢
关于 实践项目-天猫整站Springboot-产品页 的提问

尽量提供截图代码异常信息,有助于分析和解决问题。 也可进本站QQ群交流: 984886441
提问尽量提供完整的代码,环境描述,越是有利于问题的重现,您的问题越能更快得到解答。
对教程中代码有疑问,请提供是哪个步骤,哪一行有疑问,这样便于快速定位问题,提高问题得到解答的速度
在已经存在的几千个提问里,有相当大的比例,是因为使用了和站长不同版本的开发环境导致的,比如 jdk, eclpise, idea, mysql,tomcat 等等软件的版本不一致。
请使用和站长一样的版本,可以节约自己大量的学习时间。 站长把教学中用的软件版本整理了,都统一放在了这里, 方便大家下载: http://how2j.cn/k/helloworld/helloworld-version/1718.html

上传截图