一、ItemServiceImpl

  1 package com.miaoshaProject.service.impl;
  2 
  3 import com.miaoshaProject.dao.ItemDOMapper;
  4 import com.miaoshaProject.dao.ItemStockDOMapper;
  5 import com.miaoshaProject.dataobject.ItemDO;
  6 import com.miaoshaProject.dataobject.ItemStockDO;
  7 import com.miaoshaProject.error.BusinessException;
  8 import com.miaoshaProject.error.EnumBusinessError;
  9 import com.miaoshaProject.service.ItemService;
 10 import com.miaoshaProject.service.model.ItemModel;
 11 import com.miaoshaProject.validator.ValidationResult;
 12 import com.miaoshaProject.validator.ValidatorImpl;
 13 import org.springframework.beans.BeanUtils;
 14 import org.springframework.beans.factory.annotation.Autowired;
 15 import org.springframework.stereotype.Service;
 16 
 17 import java.util.List;
 18 import java.util.stream.Collectors;
 19 
 20 /**
 21  * @Author wangshuo
 22  * @Date 2022/4/19, 10:17
 23  * Please add a comment
 24  */
 25 @Service
 26 public class ItemServiceImpl implements ItemService {
 27 
 28     @Autowired
 29     ValidatorImpl validator;
 30     @Autowired
 31     ItemDOMapper itemDOMapper;
 32     @Autowired
 33     ItemStockDOMapper itemStockDOMapper;
 34     @Override
 35     public ItemModel createItem(ItemModel itemModel) throws BusinessException {
 36 
 37         //校验入参
 38         ValidationResult validator = this.validator.validator(itemModel);
 39         if (validator.isHasErrors())
 40             throw new BusinessException(EnumBusinessError.PARAMETER_VALIDATION_ERROR,validator.getErrMsg());
 41         //转化model -》 dataObject
 42         ItemDO itemDO = convertItemDOFromItemModel(itemModel);
 43         itemDOMapper.insertSelective(itemDO);
 44         itemModel.setId(itemDO.getId());
 45         ItemStockDO itemStockDO = convertItemStockDOFromItemModel(itemModel);
 46         itemStockDOMapper.insertSelective(itemStockDO);
 47         //返回创建完成的对象
 48         return this.getItemById(itemDO.getId());
 49     }
 50 
 51     @Override
 52     public List<ItemModel> listItem() {
 53 
 54         List<ItemDO> list = itemDOMapper.listItem();
 55         //java8 stream  将itemDO map成为 itemModel
 56         List<ItemModel> modelList = list.stream().map(itemDO -> {
 57             ItemStockDO itemStockDO = itemStockDOMapper.selectByItemId(itemDO.getId());
 58             ItemModel itemModel = convertModelFromDataObject(itemDO,itemStockDO);
 59             return itemModel;
 60         }).collect(Collectors.toList());
 61         return modelList;
 62     }
 63 
 64     @Override
 65     public ItemModel getItemById(Integer id) {
 66 
 67         ItemDO itemDO = itemDOMapper.selectByPrimaryKey(id);
 68         if (itemDO == null)
 69             return null;
 70         //操作获得库存数量
 71         ItemStockDO itemStockDO = itemStockDOMapper.selectByItemId(id);
 72         //convert
 73         ItemModel itemModel = convertModelFromDataObject(itemDO,itemStockDO);
 74         return itemModel;
 75     }
 76 
 77     private ItemDO convertItemDOFromItemModel(ItemModel itemModel){
 78 
 79         if (itemModel == null)
 80             return null;
 81         ItemDO itemDO = new ItemDO();
 82         BeanUtils.copyProperties(itemModel,itemDO);
 83         return itemDO;
 84     }
 85 
 86     private ItemStockDO convertItemStockDOFromItemModel(ItemModel itemModel){
 87 
 88         if (itemModel == null)
 89             return null;
 90         ItemStockDO itemStockDO = new ItemStockDO();
 91         itemStockDO.setItemId(itemModel.getId());
 92         itemStockDO.setStock(itemModel.getStock());
 93         return itemStockDO;
 94     }
 95 
 96     private ItemModel convertModelFromDataObject(ItemDO itemDO,ItemStockDO itemStockDO){
 97 
 98         ItemModel itemModel = new ItemModel();
 99         BeanUtils.copyProperties(itemDO,itemModel);
100         itemModel.setStock(itemStockDO.getStock());
101         return itemModel;
102     }
103 }

二、ItemDOMapper.xml / ItemStockDOMapper.xml

 1 <select id="listItem" resultMap="BaseResultMap">
 2     <!--
 3       WARNING - @mbg.generated
 4       This element is automatically generated by MyBatis Generator, do not modify.
 5       This element was generated on Mon Apr 18 09:20:26 CST 2022.
 6     -->
 7     select
 8     <include refid="Base_Column_List" />
 9     from item
10     order by sales desc
11   </select>
 1 <select id="selectByItemId" parameterType="java.lang.Integer" resultMap="BaseResultMap">
 2     <!--
 3       WARNING - @mbg.generated
 4       This element is automatically generated by MyBatis Generator, do not modify.
 5       This element was generated on Mon Apr 18 09:20:26 CST 2022.
 6     -->
 7     select
 8     <include refid="Base_Column_List" />
 9     from item_stock
10     where item_id = #{itemId,jdbcType=INTEGER}
11   </select>

三、itemVO

 1 package com.miaoshaProject.controller.viewobject;
 2 
 3 import java.math.BigDecimal;
 4 
 5 /**
 6  * @Author wangshuo
 7  * @Date 2022/4/19, 10:47
 8  * Please add a comment
 9  */
10 public class ItemVO {
11 
12     private Integer id;
13 
14     private String title;
15 
16     private BigDecimal price;
17 
18     private String description;
19 
20     private Integer sales;
21 
22     private String imgUrl;
23 
24     private Integer stock;
25 
26     public Integer getId() {
27         return id;
28     }
29 
30     public void setId(Integer id) {
31         this.id = id;
32     }
33 
34     public String getTitle() {
35         return title;
36     }
37 
38     public void setTitle(String title) {
39         this.title = title;
40     }
41 
42     public BigDecimal getPrice() {
43         return price;
44     }
45 
46     public void setPrice(BigDecimal price) {
47         this.price = price;
48     }
49 
50     public String getDescription() {
51         return description;
52     }
53 
54     public void setDescription(String description) {
55         this.description = description;
56     }
57 
58     public Integer getSales() {
59         return sales;
60     }
61 
62     public void setSales(Integer sales) {
63         this.sales = sales;
64     }
65 
66     public String getImgUrl() {
67         return imgUrl;
68     }
69 
70     public void setImgUrl(String imgUrl) {
71         this.imgUrl = imgUrl;
72     }
73 
74     public Integer getStock() {
75         return stock;
76     }
77 
78     public void setStock(Integer stock) {
79         this.stock = stock;
80     }
81 }

 

四、ItemController

 1 package com.miaoshaProject.controller;
 2 
 3 import com.miaoshaProject.controller.viewobject.ItemVO;
 4 import com.miaoshaProject.error.BusinessException;
 5 import com.miaoshaProject.response.CommonReturnType;
 6 import com.miaoshaProject.service.ItemService;
 7 import com.miaoshaProject.service.model.ItemModel;
 8 import org.springframework.beans.BeanUtils;
 9 import org.springframework.beans.factory.annotation.Autowired;
10 import org.springframework.stereotype.Controller;
11 import org.springframework.web.bind.annotation.RequestMapping;
12 import org.springframework.web.bind.annotation.RequestMethod;
13 import org.springframework.web.bind.annotation.RequestParam;
14 import org.springframework.web.bind.annotation.ResponseBody;
15 
16 import java.math.BigDecimal;
17 import java.util.List;
18 import java.util.stream.Collectors;
19 
20 /**
21  * @Author wangshuo
22  * @Date 2022/4/19, 10:46
23  * Please add a comment
24  */
25 @Controller("item")
26 @RequestMapping("/item")
27 public class ItemController extends BaseController{
28 
29     @Autowired
30     ItemService itemService;
31 
32     //创建商品
33     @RequestMapping(value = "/create", method = {RequestMethod.POST}, consumes = {CONTENT_TYPE_FORMED})
34     @ResponseBody
35     public CommonReturnType createItem(@RequestParam(name = "title")String title,
36                                        @RequestParam(name = "description")String description,
37                                        @RequestParam(name = "price")BigDecimal price,
38                                        @RequestParam(name = "stock")Integer stock,
39                                        @RequestParam(name = "imgUrl")String imgUrl) throws BusinessException {
40 
41         //封装service请求用来创建商品
42         ItemModel itemModel = new ItemModel();
43         itemModel.setTitle(title);
44         itemModel.setDescription(description);
45         itemModel.setPrice(price);
46         itemModel.setStock(stock);
47         itemModel.setImgUrl(imgUrl);
48 
49         ItemModel item = itemService.createItem(itemModel);
50         ItemVO itemVO = convertItemVOFromItemModel(itemModel);
51         return CommonReturnType.create(itemVO);
52     }
53 
54     //商品详情页浏览
55     @RequestMapping(value = "/get", method = {RequestMethod.GET})
56     @ResponseBody
57     public CommonReturnType getItem(@RequestParam(value = "id")Integer id){
58 
59         ItemModel itemModel = itemService.getItemById(id);
60         ItemVO itemVO = convertItemVOFromItemModel(itemModel);
61         return CommonReturnType.create(itemVO);
62     }
63     
64     //商品列表
65     @RequestMapping(value = "/list", method = {RequestMethod.GET})
66     @ResponseBody
67     public CommonReturnType itemList(){
68 
69         //java8 stream   将itemModel map成为 itemVO
70         List<ItemModel> list = itemService.listItem();
71         List<ItemVO> voList = list.stream().map(itemModel -> {
72             ItemVO itemVO = convertItemVOFromItemModel(itemModel);
73             return itemVO;
74         }).collect(Collectors.toList());
75         return CommonReturnType.create(voList);
76     }
77 
78     private ItemVO convertItemVOFromItemModel(ItemModel itemModel) {
79         if (itemModel == null)
80             return null;
81         ItemVO itemVO = new ItemVO();
82         BeanUtils.copyProperties(itemModel,itemVO);
83         return itemVO;
84     }
85 }

五、createitem.html / listitem.html / getitem.html

<html>
<head>
    <meta charset="UTF-8">
    <link rel="stylesheet" href="assets/global/plugins/bootstrap/css/bootstrap.min.css" type="text/css"/>
    <link rel="stylesheet" href="assets/global/css/components.css" type="text/css"/>
    <link rel="stylesheet" href="assets/admin/pages/css/login.css" type="text/css"/>
    <script rel="stylesheet" src="assets/global/plugins/jquery-1.11.0.min.js" type="text/javascript"></script>
</head>
<body class="login" background="edge_bj_1.jpg">

<div class="content">
    <h3 class="form-title">创建商品</h3>
    <div class="form-group">
        <label class="control-label">商品名</label>
        <div>
            <input type="text" class="form-control" placeholder="商品名" name="title" id="title">
        </div>
    </div>
    <div class="form-group">
        <label class="control-label">商品描述</label>
        <div>
            <input type="text" class="form-control" placeholder="商品描述" name="description" id="description">
        </div>
    </div>
    <div class="form-group">
        <label class="control-label">商品价格</label>
        <div>
            <input type="text" class="form-control" placeholder="商品价格" name="price" id="price">
        </div>
    </div>
    <div class="form-group">
        <label class="control-label">图片路径</label>
        <div>
            <input type="text" class="form-control" placeholder="图片路径" name="imgUrl" id="imgUrl">
        </div>
    </div>
    <div class="form-group">
        <label class="control-label">商品库存</label>
        <div>
            <input type="text" class="form-control" placeholder="商品库存" name="stock" id="stock">
        </div>
    </div>
    <div>
        <button class="btn blue" id="create" type="submit">
            提交创建
        </button>
    </div>
</div>

</body>
<script>

    jQuery(document).ready(function () {

        //绑定otp的click事件用于向后端发送手机验证码的请求
        $("#create").on("click", function () {

            var title = $("#title").val();
            var description = $("#description").val();
            var price = $("#price").val();
            var imgUrl = $("#imgUrl").val();
            var stock = $("#stock").val();
            if (title == null || title == '') {
                alert("商品名不能为空");
                return false;
            }
            if (description == null || description == '') {
                alert("描述不能为空");
                return false;
            }
            if (imgUrl == null || imgUrl == '') {
                alert("图片路径不能为空");
                return false;
            }
            if (stock == null || stock == '') {
                alert("库存不能为空");
                return false;
            }
            if (price == null || price == '') {
                alert("价格不能为空");
                return false;
            }
            $.ajax({
                type: "POST",
                contentType: "application/x-www-form-urlencoded",
                url: "http://localhost:8080/item/create",
                data: {
                    "title": $("#title").val(),
                    "description": $("#description").val(),
                    "price": $("#price").val(),
                    "stock": $("#stock").val(),
                    "imgUrl": $("#imgUrl").val(),
                },
                dataType: "json",
                xhrFields: {
                    withCredentials: true
                },
                crossDomain: true,
                success: function (result) {

                    if (result.status == "success") {
                        alert("创建成功")
                    } else {
                        alert("请求失败 原因为:" + result.data.errMsg)
                    }
                }
            });
        })
    })

</script>
</html>
<html>
<head>
    <meta charset="UTF-8">
    <link rel="stylesheet" href="assets/global/plugins/bootstrap/css/bootstrap.min.css" type="text/css"/>
    <link rel="stylesheet" href="assets/global/css/components.css" type="text/css"/>
    <link rel="stylesheet" href="assets/admin/pages/css/login.css" type="text/css"/>
    <script rel="stylesheet" src="assets/global/plugins/jquery-1.11.0.min.js" type="text/javascript"></script>
</head>
<body class="login" background="../BingWallpaper (2).jpg">

<div style="height: 100%;width: 100%;background-color: rgba(0,255,255,0)" class="content">
    <h3 class="form-title">商品列表浏览</h3>
    <div class="table-responsive">
        <table class="table">
            <thead>
            <tr>
                <th>商品名</th>
                <th>商品图片</th>
                <th>商品描述</th>
                <th>商品价格</th>
                <th>商品销量</th>
                <th>商品库存</th>
            </tr>
            </thead>
            <tbody id="container"></tbody>
        </table>
    </div>
</div>

</body>
<script>

    //定义全局商品数据信息
    var g_itemlist = [];
    jQuery(document).ready(function () {

        $.ajax({
            type: "GET",
            contentType: "application/x-www-form-urlencoded",
            url: "http://localhost:8080/item/list",
            data: {},
            dataType: "json",
            xhrFields: {
                withCredentials: true
            },
            crossDomain: true,
            success: function (result) {

                if (result.status == "success") {

                    g_itemlist = result.data;
                    //append
                    reloadDom();
                } else {
                    alert("请求失败 原因为:" + result.data.errMsg)
                }
            },
            error: function (result) {
                alert("请求失败 原因为:" + result.responseText)
            }
        });
    })

    function reloadDom() {

        for (var i = 0; i < g_itemlist.length; i++) {
            var itemVO = g_itemlist[i];

            //拼接 详情页跳转(将id作为参数)
            var dom = "<tr data-id='" + itemVO.id + "' id='itemDetail" + itemVO.id + "'>" +
                "<td>" + itemVO.title + "</td>" +
                "<td><img style='width: 100px;height: auto' src='" + itemVO.imgUrl + "'/></td>" +
                "<td>" + itemVO.description + "</td>" +
                "<td>" + itemVO.price + "</td>" +
                "<td>" + itemVO.sales + "</td>" +
                "<td>" + itemVO.stock + "</td>" +
                "</tr>";
            $("#container").append(dom);

            $("#itemDetail" + itemVO.id).on("click", function (e) {

                window.location.href = "getItem.html?id=" + $(this).data("id");
            })
        }
    }

</script>
</html>
<html>
<head>
    <meta charset="UTF-8">
    <link rel="stylesheet" href="assets/global/plugins/bootstrap/css/bootstrap.min.css" type="text/css"/>
    <link rel="stylesheet" href="assets/global/css/components.css" type="text/css"/>
    <link rel="stylesheet" href="assets/admin/pages/css/login.css" type="text/css"/>
    <script rel="stylesheet" src="assets/global/plugins/jquery-1.11.0.min.js" type="text/javascript"></script>
</head>
<body class="login" background="edge_bj_1.jpg">

<div class="content">
    <h3 class="form-title">商品详情</h3>
    <div class="form-group">
        <div>
            <label class="control-label" id="title"/>
        </div>
    </div>
    <div class="form-group">
        <label class="control-label" style="font-size: 18px">商品描述</label>
        <div>
            <label class="control-label" id="description"/>
        </div>
    </div>
    <div class="form-group">
        <div>
            <label class="control-label" id="price"/>
        </div>
    </div>
    <div class="form-group">
        <div>
            <img style="width: 200px;height: auto" id="imgUrl">
        </div>
    </div>
    <div class="form-group">
        <label class="control-label" style="font-size: 18px">商品库存</label>
        <div>
            <label class="control-label" id="stock"/>
        </div>
    </div>
    <div class="form-group">
        <label class="control-label" style="font-size: 18px">商品销量</label>
        <div>
            <label class="control-label" id="sales"/>
        </div>
    </div>
</div>

</body>
<script>

    function getParam(paramName) {
        paramValue = "", isFound = !1;
        if (this.location.search.indexOf("?") == 0 && this.location.search.indexOf("=") > 1) {
            arrSource = unescape(this.location.search).substring(1, this.location.search.length).split("&"), i = 0;
            while (i < arrSource.length && !isFound) arrSource[i].indexOf("=") > 0 && arrSource[i].split("=")[0].toLowerCase() == paramName.toLowerCase() && (paramValue = arrSource[i].split("=")[1], isFound = !0), i++
        }
        return paramValue == "" && (paramValue = null), paramValue
    }

    function reloadDom(){

        $("#title").text(g_itemVO.title);
        $("#description").text(g_itemVO.description);
        $("#stock").text(g_itemVO.stock);
        $("#price").text(g_itemVO.price);
        $("#sales").text(g_itemVO.sales);
        $("#imgUrl").attr("src",g_itemVO.imgUrl);
    }

    var g_itemVO = {};

    jQuery(document).ready(function () {

        //获取商品详情
        $.ajax({
            type: "GET",
            contentType: "application/x-www-form-urlencoded",
            url: "http://localhost:8080/item/get",
            data: {
                "id": getParam("id")
            },
            dataType: "json",
            xhrFields: {
                withCredentials: true
            },
            crossDomain: true,
            success: function (result) {

                if (result.status == "success") {
                    g_itemVO = result.data;
                        reloadDom();
                } else {
                    alert("请求失败 原因为:" + result.data.errMsg)
                }
            },
            error: function (result) {
                alert("请求失败  原因为" + result.responseText)
            }
        })
    })
</script>
</html>