shop--9.商品类别--列表展示

商店管理中的类别管理

功能：从后台返回商品信息，动态生成删除按钮

dao层开始

1     /**
2      * 通过shopId查询店铺商品类别
3      * @param long 
4      *          shopId
5      * @return
6      */
7     List<ProductCategory> queryProductCategoryList(@Param("shopId") long shopId);

映射文件

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE mapper 
  PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN" 
  "http://mybatis.org/dtd/mybatis-3-mapper.dtd">
<mapper namespace="com.ryanxu.o2o.dao.ProductCategoryDao">
    <select id="queryProductCategoryList" parameterType="Long"
        resultType="com.ryanxu.o2o.entity.ProductCategory">
        select
        product_category_id,
        product_category_name,
        priority,
        create_time,
        shop_id
        from tb_product_category
        where shop_id = #{shopId}
        ORDER BY
        priority DESC
    </select>
</mapper>

Service层

1     /**
2      * 查询指定某个店铺下的所有商品类别信息
3      * 
4      * @param long shopId
5      * @return List<ProductCategory>
6      */
7     List<ProductCategory> getProductCategoryList(long shopId);

Service实现类

 1 @Service
 2 public class ProductCategoryServiceImpl implements ProductCategoryService{
 3     @Autowired
 4     private ProductCategoryDao productCategoryDao;
 5 
 6     @Override
 7     public List<ProductCategory> getProductCategoryList(long shopId) {
 8         return productCategoryDao.queryProductCategoryList(shopId);
 9     }
10 }

Controller层

 1 @Controller
 2 @RequestMapping("/shopadmin")
 3 public class ProductCategoryManagementController {
 4     @Autowired
 5     private ProductCategoryService productCategoryService;
 6     
 7     @RequestMapping(value="/getproductcategorylist", method=RequestMethod.GET)
 8     @ResponseBody
 9     private Map<String, Object> getProductCategoryList(HttpServletRequest request){
10         Map<String, Object> modelMap = new HashMap<>();
11         Shop currentShop = (Shop) request.getSession().getAttribute("currentShop");
12         List<ProductCategory> list = null;
13         if(currentShop!=null&&currentShop.getShopId()>0) {
14             list = productCategoryService.getProductCategoryList(currentShop.getShopId());
15             modelMap.put("productcategorylist", list);
16             modelMap.put("success", true);
17         }else {
18             modelMap.put("errMsg", "当前店铺为空");
19             modelMap.put("success", false);
20         }
21         return modelMap;
22     }
23 }

productcategorymanagement.html

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>商店列表</title>
    <meta name="viewport" content="initial-scale=1, maximum-scale=1">
    <link rel="shortcut icon" href="/favicon.ico">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <link rel="stylesheet" href="//g.alicdn.com/msui/sm/0.6.2/css/sm.min.css">
    <link rel="stylesheet" href="//g.alicdn.com/msui/sm/0.6.2/css/sm-extend.min.css">
    <link rel="stylesheet" href="../resources/css/shop/productcategorymanagement.css">
</head>
<body>
<header class="bar bar-nav">
    <h1 class="title">商品分类管理</h1>
</header>
<div class="content">
    <div class="content-block">
        <div class="row row-product-category">
            <div class="col-40">商店名称</div>
            <div class="col-40">状态</div>
            <div class="col-20">操作</div>
        </div>
    <span style="color:#0000ff;">&lt;</span><span style="color:#800000;">div </span><span style="color:#ff0000;">class</span><span style="color:#0000ff;">="category-wrap"</span><span style="color:#0000ff;">&gt;</span>

    <span style="color:#0000ff;">&lt;/</span><span style="color:#800000;">div</span><span style="color:#0000ff;">&gt;</span>
<span style="color:#0000ff;">&lt;/</span><span style="color:#800000;">div</span><span style="color:#0000ff;">&gt;</span>
<span style="color:#0000ff;">&lt;</span><span style="color:#800000;">div </span><span style="color:#ff0000;">class</span><span style="color:#0000ff;">="content-block"</span><span style="color:#0000ff;">&gt;</span>
    <span style="color:#0000ff;">&lt;</span><span style="color:#800000;">div </span><span style="color:#ff0000;">class</span><span style="color:#0000ff;">="row"</span><span style="color:#0000ff;">&gt;</span>
        <span style="color:#0000ff;">&lt;</span><span style="color:#800000;">div </span><span style="color:#ff0000;">class</span><span style="color:#0000ff;">="col-50"</span><span style="color:#0000ff;">&gt;</span>
            <span style="color:#0000ff;">&lt;</span><span style="color:#800000;">a </span><span style="color:#ff0000;">href</span><span style="color:#0000ff;">="#"</span><span style="color:#ff0000;"> id</span><span style="color:#0000ff;">="log-out"</span><span style="color:#ff0000;">
               class</span><span style="color:#0000ff;">="button button-big button-fill button-danger"</span><span style="color:#0000ff;">&gt;</span>新增<span style="color:#0000ff;">&lt;/</span><span style="color:#800000;">a</span><span style="color:#0000ff;">&gt;</span>
        <span style="color:#0000ff;">&lt;/</span><span style="color:#800000;">div</span><span style="color:#0000ff;">&gt;</span>
        <span style="color:#0000ff;">&lt;</span><span style="color:#800000;">div </span><span style="color:#ff0000;">class</span><span style="color:#0000ff;">="col-50"</span><span style="color:#0000ff;">&gt;</span>
            <span style="color:#0000ff;">&lt;</span><span style="color:#800000;">a </span><span style="color:#ff0000;">href</span><span style="color:#0000ff;">="/shop/changepsw"</span><span style="color:#ff0000;"> class</span><span style="color:#0000ff;">="button button-big button-fill button-success"</span><span style="color:#0000ff;">&gt;</span>提交<span style="color:#0000ff;">&lt;/</span><span style="color:#800000;">a</span><span style="color:#0000ff;">&gt;</span>
        <span style="color:#0000ff;">&lt;/</span><span style="color:#800000;">div</span><span style="color:#0000ff;">&gt;</span>
    <span style="color:#0000ff;">&lt;/</span><span style="color:#800000;">div</span><span style="color:#0000ff;">&gt;</span>
<span style="color:#0000ff;">&lt;/</span><span style="color:#800000;">div</span><span style="color:#0000ff;">&gt;</span>

</div>

productcategorymanagement.js

$(function() {
    var listUrl = '/o2o/shopadmin/getproductcategorylist';
    var addUrl = '/o2o/shop/addproductcategorys';
    var deleteUrl = '/o2o/shop/removeproductcategory';
    getList();
    function getList() {
        $.getJSON(listUrl, function(data) {
            if (data.success) {
                $('.category-wrap').html('');
                var tempHtml = '';
                //遍历procategorylist的列表
                data.productcategorylist.map(function(item, index) {//需要注意的是data.productcategorylist这个productcategorylist是要与Controller层中的Map.put做好约定
                    tempHtml += ''
                        + '<div class="row row-product-category now">'
                        + '<div class="col-33 product-category-name">'
                        + item.productCategoryName
                        + '</div>'
                        + '<div class="col-33">'
                        + item.priority
                        + '</div>'
                        + '<div class="col-33"><a href="#" class="button delete" data-id="'
                        + item.productCategoryId
                        + '">删除</a></div>'
                        + '</div>';
                });
                //填进category-wrap控件里
                $('.category-wrap').append(tempHtml);
            }
        });
    }
});

productcategorymanagement.css

.row-product-category {
    border: 1px solid #999;
    padding: .5rem;
    border-bottom: none;
}
.row-product-category:last-child {
    border-bottom: 1px solid #999;
}
.category-input {
    border: none;
    background-color: #eee;
}
.product-category-name {
    white-space: nowrap;
    overflow-x: scroll;
}

同时更改路由

1     @RequestMapping(value = "/productcategorymanagement",method=RequestMethod.GET)
2     public String productcategoryList() {
3         return "shop/productcategorymanagement";
4     }

转载于:https://www.cnblogs.com/windbag7/p/9390683.html

                    <li class="tool-item tool-active is-like "><a href="javascript:;"><svg class="icon" aria-hidden="true">
                        <use xlink:href="#csdnc-thumbsup"></use>
                    </svg><span class="name">点赞</span>
                    <span class="count"></span>
                    </a></li>
                    <li class="tool-item tool-active is-collection "><a href="javascript:;" data-report-click="{&quot;mod&quot;:&quot;popu_824&quot;}"><svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-csdnc-Collection-G"></use>
                    </svg><span class="name">收藏</span></a></li>
                    <li class="tool-item tool-active is-share"><a href="javascript:;"><svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-csdnc-fenxiang"></use>
                    </svg>分享</a></li>
                    <!--打赏开始-->
                                            <!--打赏结束-->
                                            <li class="tool-item tool-more">
                        <a>
                        <svg t="1575545411852" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="5717" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><defs><style type="text/css"></style></defs><path d="M179.176 499.222m-113.245 0a113.245 113.245 0 1 0 226.49 0 113.245 113.245 0 1 0-226.49 0Z" p-id="5718"></path><path d="M509.684 499.222m-113.245 0a113.245 113.245 0 1 0 226.49 0 113.245 113.245 0 1 0-226.49 0Z" p-id="5719"></path><path d="M846.175 499.222m-113.245 0a113.245 113.245 0 1 0 226.49 0 113.245 113.245 0 1 0-226.49 0Z" p-id="5720"></path></svg>
                        </a>
                        <ul class="more-box">
                            <li class="item"><a class="article-report">文章举报</a></li>
                        </ul>
                    </li>
                                        </ul>
            </div>
                        </div>
        <div class="person-messagebox">
            <div class="left-message"><a href="https://blog.csdn.net/weixin_30888707">
                <img src="https://profile.csdnimg.cn/0/A/F/3_weixin_30888707" class="avatar_pic" username="weixin_30888707">
                                        <img src="https://g.csdnimg.cn/static/user-reg-year/2x/4.png" class="user-years">
                                </a></div>
            <div class="middle-message">
                                    <div class="title"><span class="tit"><a href="https://blog.csdn.net/weixin_30888707" data-report-click="{&quot;mod&quot;:&quot;popu_379&quot;}" target="_blank">weixin_30888707</a></span>
                                        </div>
                <div class="text"><span>发布了0 篇原创文章</span> · <span>获赞 12</span> · <span>访问量 4万+</span></div>
            </div>
                            <div class="right-message">
                                        <a href="https://im.csdn.net/im/main.html?userName=weixin_30888707" target="_blank" class="btn btn-sm btn-red-hollow bt-button personal-letter">私信
                    </a>
                                                        <a class="btn btn-sm  bt-button personal-watch" data-report-click="{&quot;mod&quot;:&quot;popu_379&quot;}">关注</a>
                                </div>
                        </div>
                </div>

别抢我蓝buff

发布了45 篇原创文章 · 获赞 0 · 访问量 3507

私信关注