SSM到Spring Boot-从零开发校园商铺平台六(店铺编辑和列表功能)

店铺信息编辑之Dao层开发

ShopDao

     /**
     * 通过owner id 查询店铺
     */
    Shop queryByShopId(long shopId);

ShopDao.xml

<?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.imooc.o2o.dao.ShopDao">
    <resultMap id="shopMap" type="com.imooc.o2o.entity.Shop">
        <id column="shop_id" property="shopId" />
        <result column="owner_id" property="ownerId" />
        <result column="shop_category_id" property="shopCategoryId" />
        <result column="shop_name" property="shopName" />
        <result column="shop_desc" property="shopDesc" />
        <result column="shop_addr" property="shopAddr" />
        <result column="phone" property="phone" />
        <result column="shop_img" property="shopImg" />
        <result column="longitude" property="longitude" />
        <result column="latitude" property="latitude" />
        <result column="priority" property="priority" />
        <result column="create_time" property="createTime" />
        <result column="last_edit_time" property="lastEditTime" />
        <result column="enable_status" property="enableStatus" />
        <result column="advice" property="advice" />

        <association property="area" column="area_id"
                     javaType="com.imooc.o2o.entity.Area">
            <id column="area_id" property="areaId"/>
            <result column="area_name" property="areaName"/>
        </association>
        <association property="shopCategory" column="shop_category_id"
                                           javaType="com.imooc.o2o.entity.ShopCategory">
        <id column="shop_category_id" property="shopCategoryId" />
        <result column="shop_category_name" property="shopCategoryName" />
        </association>
        <association property="owner" column="user_id"
                     javaType="com.imooc.o2o.entity.PersonInfo">
            <id column="user_id" property="userId" />
            <result column="name" property="name" />
        </association>
    </resultMap>
    <select id="queryByShopId" resultMap="shopMap" parameterType="Long">
        <!-- 具体的sql -->
        SELECT
        s.shop_id,
        s.shop_name,
        s.shop_desc,
        s.shop_addr,
        s.phone,
        s.shop_img,
        s.create_time,
        s.last_edit_time,
        s.enable_status,
        s.advice,
        a.area_id,
        a.area_name,
        sc.shop_category_id,
        sc.shop_category_name
        FROM
        tb_shop s,
        tb_area a,
        tb_shop_category sc
        WHERE
        s.shop_category_id =sc.shop_category_id
        and s.shop_id = #{shopId}
    </select>
    <insert id="insertShop" useGeneratedKeys="true" keyColumn="shop_id"
            keyProperty="shopId">
        insert into tb_shop(owner_id,area_id,shop_category_id,shop_name,shop_desc,shop_addr,phone,
        shop_img,priority,create_time,last_edit_time,enable_status,advice)
        values (
        #{owner.userId},#{area.areaId},#{shopCategory.shopCategoryId},#{shopName},#{shopDesc},
        #{shopAddr},#{phone},#{shopImg},#{priority},#{createTime},#{lastEditTime},#{enableStatus},
        #{advice}
        )
    </insert>

    <update id="updateShop" parameterType="com.imooc.o2o.entity.Shop">
        update tb_shop
        <set>
            <if test="shopName!=null">shop_name=#{shopName},</if>
            <if test="shopDesc != null">shop_desc=#{shopDesc},</if>
            <if test="shopAddr != null">shop_addr=#{shopAddr},</if>
            <if test="phone != null">phone=#{phone},</if>
            <if test="shopImg != null">shop_img=#{shopImg},</if>
            <if test="priority != null">priority=#{priority},</if>
            <if test="lastEditTime != null">last_edit_time=#{lastEditTime},</if>
            <if test="enableStatus != null">enable_status=#{enableStatus},</if>
            <if test="advice != null">advice=#{advice},</if>
            <if test="area != null">area_id=#{area.areaId},</if>
            <if test="shopCategory != null">shop_category_id=#{shopCategory.shopCategoryId}</if>
        </set>
        where shop_id=#{shopId}
    </update>
</mapper>

Test

    @Test
    public void queryByShopId(){
        long shopId=1;
        Shop shop = shopDao.queryByShopId(shopId);
        System.out.println("areaId:"+shop.getShopId());
        System.out.println("areaName:"+shop.getShopName());
    }

店铺信息编辑之Serice实现

shopService

    /**
     * 查询指定店铺信息
     * @param shopId
     * @return
     */
    Shop getByShopId(long shopId);

    /**
     * 更新店铺信息(从店家角度)
     * @param shop
     * @param shopImg
     * @return
     * @throws RuntimeException
     */
    ShopExecution modifyShop(Shop shop, InputStream shopImgInputStream,
                             String fileName) throws RuntimeException;

shopServiceImpl

@Override
    public Shop getByShopId(long shopId) {
        return shopDao.queryByShopId(shopId);
    }

    @Override
    public ShopExecution modifyShop(Shop shop,
                                    InputStream shopImgInputStream,
                                    String fileName) throws RuntimeException {
        if(shop ==null||shop.getShopId()==null){
            return new ShopExecution(ShopStateEnum.NULL_SHOPID);
        }else{
            try {
                //1.判断是否需要处理图片
                if (shopImgInputStream != null && fileName!=null && !"".equals(fileName)) {
                    Shop tempShop = shopDao.queryByShopId(shop.getShopId());
                    if (tempShop.getShopImg() != null) {
                        ImageUtil.deleteFileOrPath(tempShop.getShopImg());
                    }
                    addShopImg(shop, shopImgInputStream,fileName);
                }
                //更新店铺信息
                shop.setLastEditTime(new Date());
                int effectedNum = shopDao.updateShop(shop);
                if (effectedNum <= 0) {
                    return new ShopExecution(ShopStateEnum.INNER_ERROR);
                } else {// 创建成功
                    shop = shopDao.queryByShopId(shop.getShopId());
                    return new ShopExecution(ShopStateEnum.SUCCESS, shop);
                }
            } catch (Exception e) {
                throw new RuntimeException("modifyShop error: "
                        + e.getMessage());
            }
        }
    }

 

Controller层的实现

ShopManagementController中加入getShopById和modifyShop

@RequestMapping(value = "/getshopbyid",method = RequestMethod.GET)
    @ResponseBody
    private Map<String,Object> getShopById(HttpServletRequest request){
        Map<String,Object> modelMap = new HashMap<String,Object>();
        Long shopId = HttpServletRequestUtil.getLong(request,"shopId");
        if(shopId>-1){
            try {
                //获取店铺信息
                Shop shop = shopService.getByShopId(shopId);
                //获取区域列表
                List<Area> areaList = areaService.getAreaList();
                modelMap.put("shop",shop);
                modelMap.put("areaList",areaList);
                modelMap.put("success",true);
            } catch (Exception e) {
                modelMap.put("success",false);
                modelMap.put("errMsg",e.toString());
            }
        }else {
            modelMap.put("success",false);
            modelMap.put("errMsg","empty shopId");
        }
        return modelMap;
    }

@RequestMapping(value = "/modifyshop", method = RequestMethod.POST)
    @ResponseBody
    private Map<String, Object> modifyShop(HttpServletRequest request) {
        Map<String, Object> modelMap = new HashMap<String, Object>();
        //验证码
        if(!CodeUtil.checkVerifyCode(request)){
            modelMap.put("success",false);
            modelMap.put("errMsg","输入了错误的验证码");
            return modelMap;
        }
        //1.接受并转化相关的参数，包括店铺信息以及图片信息
        String shopStr = HttpServletRequestUtil.getString(request, "shopStr");
        ObjectMapper mapper = new ObjectMapper();
        Shop shop = null;
        try {
            shop = mapper.readValue(shopStr, Shop.class);
        } catch (Exception e) {
            modelMap.put("success", false);
            modelMap.put("errMsg", e.getMessage());
        }
        //接受图片信息
        CommonsMultipartFile shopImg =null;
        CommonsMultipartResolver commonsMultipartResolver = new CommonsMultipartResolver(
                request.getSession().getServletContext());
        if(commonsMultipartResolver.isMultipart(request)){
            MultipartHttpServletRequest multipartHttpServletRequest =
                    (MultipartHttpServletRequest)request;
            shopImg =
                    (CommonsMultipartFile)multipartHttpServletRequest.getFile("shopImg");

        }
        //2.修改店铺信息
        if(shop!=null&&shop.getShopId()!=null){
            ShopExecution se = null;
            try {
                if(shopImg==null){
                    se = shopService.modifyShop(shop,null,null);
                }else {
                    se = shopService.modifyShop(shop,
                            shopImg.getInputStream(),shopImg.getOriginalFilename());
                }

                if(se.getState()== ShopStateEnum.SUCCESS.getState()){
                    modelMap.put("success",true);
                }else {
                    modelMap.put("success",false);
                    modelMap.put("errMsg",se.getStateInfo());
                }
            } catch (IOException e) {
                modelMap.put("success",false);
                modelMap.put("errMsg",e.getMessage());
                e.printStackTrace();
            }

            return modelMap;
        }else {
            modelMap.put("success",false);
            modelMap.put("errMsg","请输入店铺id");
            return modelMap;
        }

    }

修改/registershop添加session将用户可以操作的店铺列表添加到session

 @RequestMapping(value = "/registershop", method = RequestMethod.POST)
    @ResponseBody
    private Map<String, Object> listShop(HttpServletRequest request) {
        Map<String, Object> modelMap = new HashMap<String, Object>();
        //验证码
        if(!CodeUtil.checkVerifyCode(request)){
            modelMap.put("success",false);
            modelMap.put("errMsg","输入了错误的验证码");
            return modelMap;
        }
        //1.接受并转化相关的参数，包括店铺信息以及图片信息
        String shopStr = HttpServletRequestUtil.getString(request, "shopStr");
        ObjectMapper mapper = new ObjectMapper();
        Shop shop = null;
        try {
            shop = mapper.readValue(shopStr, Shop.class);
        } catch (Exception e) {
            modelMap.put("success", false);
            modelMap.put("errMsg", e.getMessage());
        }
        //接受图片信息
        CommonsMultipartFile shopImg =null;
        CommonsMultipartResolver commonsMultipartResolver = new CommonsMultipartResolver(
                request.getSession().getServletContext());
        if(commonsMultipartResolver.isMultipart(request)){
            MultipartHttpServletRequest multipartHttpServletRequest =
                    (MultipartHttpServletRequest)request;
            shopImg =
                    (CommonsMultipartFile)multipartHttpServletRequest.getFile("shopImg");

        }else {
            modelMap.put("success",false);
            modelMap.put("errMsg","上传图片不能为空");
            return modelMap;
        }
        //2.注册店铺
        if(shop!=null&&shopImg!=null){
            PersonInfo owner = (PersonInfo)request.getSession().getAttribute(
                    "user");
            shop.setOwner(owner);
            ShopExecution se = null;
            try {
                se = shopService.addShop(shop,
                        shopImg.getInputStream(),shopImg.getOriginalFilename());
                if(se.getState()== ShopStateEnum.CHECK.getState()){
                    modelMap.put("success",true);
                    //该用户可以操作的店铺列表
                    List<Shop> shopList =
                            (List<Shop>)request.getSession().getAttribute(
                                    "shopList");
                    if(shopList==null||shopList.size()==0){
                        shopList =new ArrayList<Shop>();
                    }
                    shopList.add(se.getShop());
                    request.getSession().setAttribute("shopList",shopList);
                }else {
                    modelMap.put("success",false);
                    modelMap.put("errMsg",se.getStateInfo());
                }
            } catch (IOException e) {
                modelMap.put("success",false);
                modelMap.put("errMsg",e.getMessage());
                e.printStackTrace();
            }

            return modelMap;
        }else {
            modelMap.put("success",false);
            modelMap.put("errMsg","请输入店铺信息");
            return modelMap;
        }

    }

店铺信息编辑之前端实现

commonutil.js中加入以下代码获取shopId

function getQueryString(name){
    var reg = new RegExp("(^|&)"+name+"=([^&]*)(&|$)");
    var r = window.location.search.substr(1).match(reg);
    if(r!=null){
        return decodeURIComponent(r[2]);
    }
    return '';
}

$(function () {
    var shopId = getQueryString('shopId');
    var isEdit = shopId?true:false;

    var initUrl='/shopadmin/getshopinitinfo';
    //注册店铺
    var regidterShopUrl ='/shopadmin/registershop';
    //根据shopId获取用户信息
    var shopInfoUrl= "/shopadmin/getshopbyid?shopId="+shopId;
    var editShopUrl = '/shopadmin/modifyshop';

    //如果传入shopId则调用getShopInfo(shopId)获取店铺信息以及区域列表
    if(!isEdit){
        getShopInitInfo();
    }else {
        getShopInfo(shopId);
    }

    function getShopInfo(shopId) {
        $.getJSON(shopInfoUrl,function(data){
            if(data.success){
                var shop =data.shop;
                $('#shop-name').val(shop.shopName);
                $('#shop-addr').val(shop.shopAddr);
                $('#shop-phone').val(shop.phone);
                $('#shop-desc').val(shop.shopDesc);
                var shopCategory='<option data-id="'
                    + shop.shopCategory.shopCategoryId+'"selected>'
                    + shop.shopCategory.shopCategoryName+'</option>';
                var tempAreaHtml = '';

                data.areaList.map(function (item,index) {
                    tempAreaHtml+='<option data-id="'+item.areaId+'">'
                        + item.areaName+'</option>';
                });

                $('#shop-category').html(shopCategory);
                $('#shop-category').attr('disabled','disabled');
                $('#area').html(tempAreaHtml);
                $("#area option[data-id='"+shop.area.areaId+"]").attr("selected","selected");

            }
        });
    }
    function getShopInitInfo() {
        $.getJSON(initUrl,function (data) {
            if(data.success){
                var tempHtml="";
                //获取区域信息
                var tempAreaHtml="";
                //后台获取的店铺分类列表，遍历
                data.shopCategoryList.map(function (item,index) {
                    tempHtml+='<option data-id="'+item.shopCategoryId+'">'+item.shopCategoryName+'</option>'
                });
                //区域信息
                data.areaList.map(function (item,index) {
                    tempAreaHtml+='<option data-id="'+item.areaId+'">'+item.areaName+'</option>';
                });
                $('#shop-category').html(tempHtml);
                $('#area').html(tempAreaHtml);

            }
        });

    }
    //点击提交后的响应
    $('#submit').click(function () {
        var shop ={};
        if(isEdit){
            shop.shopId=shopId;
        }
        //从控件中获取信息
        shop.shopName=$('#shop-name').val();
        shop.shopAddr=$('#shop-addr').val();
        shop.phone=$('#shop-phone').val();
        shop.shopDesc=$('#shop-desc').val();
        //获取列表中的数据
        shop.shopCategory={
            shopCategoryId:$('#shop-category').find('option').not(function(){
                return !this.selected;
            }).data('id')
        };
        shop.area = {
            areaId:$('#area').find('option').not(function () {
                return !this.selected;
            }).data('id')
        };
        var shopImg =$('#shop-img')[0].files[0];
        var formData = new FormData();
        formData.append('shopImg',shopImg);
        formData.append('shopStr',JSON.stringify(shop));
        var verifyCodeActual=$('#j_captcha').val();
        if(!verifyCodeActual){
            $.toast('请输入验证码！');
            return;
        }
        formData.append('verifyCodeActual',verifyCodeActual);
        $.ajax({
            url:editShopUrl,
            type:'POST',
            data:formData,
            contentType:false,
            processData:false,
            cache:false,
            success:function (data) {
                if(data.success){
                    $.toast('提交成功');
                }else{
                    $.toast('提交失败'+data.errMsg);
                }
                $('#captcha_img').click();
            }
        });
    });
})

店铺列表展示Dao的实现

在ShopDao插入

    /**
     * 分页查询店铺，可输入的条件有，店铺名(模糊)查询，店铺状态，店铺类别，区域id，owner
     * @param shopCondition
     * @param roeIndex 从第几行开始取数据
     * @param pageSize 返回的条数
     * @return
     */
    List<Shop> queryShopList(@Param("shopCondition")Shop shopCondition,
                             @Param("rowIndex")int roeIndex,
                             @Param("pageSize")int pageSize);

    /**
     * 返回queryShopList总数
     * @param shopCondition
     * @return
     */
    int queryShopCount(@Param("shopCondition")Shop shopCondition);

ShopDao.xml

<resultMap id="shopMap" type="com.imooc.o2o.entity.Shop">
        <id column="shop_id" property="shopId" />
        <result column="owner_id" property="ownerId" />
        <result column="shop_category_id" property="shopCategoryId" />
        <result column="shop_name" property="shopName" />
        <result column="shop_desc" property="shopDesc" />
        <result column="shop_addr" property="shopAddr" />
        <result column="phone" property="phone" />
        <result column="shop_img" property="shopImg" />
        <result column="longitude" property="longitude" />
        <result column="latitude" property="latitude" />
        <result column="priority" property="priority" />
        <result column="create_time" property="createTime" />
        <result column="last_edit_time" property="lastEditTime" />
        <result column="enable_status" property="enableStatus" />
        <result column="advice" property="advice" />

        <association property="area" column="area_id"
                     javaType="com.imooc.o2o.entity.Area">
            <id column="area_id" property="areaId"/>
            <result column="area_name" property="areaName"/>
        </association>
        <association property="shopCategory" column="shop_category_id"
                                           javaType="com.imooc.o2o.entity.ShopCategory">
        <id column="shop_category_id" property="shopCategoryId" />
        <result column="shop_category_name" property="shopCategoryName" />
        </association>
        <association property="owner" column="user_id"
                     javaType="com.imooc.o2o.entity.PersonInfo">
            <id column="user_id" property="userId" />
            <result column="name" property="name" />
        </association>
    </resultMap>

    <select id="queryShopList" resultMap="shopMap">
        SELECT
        s.shop_id,
        s.shop_name,
        s.shop_desc,
        s.shop_addr,
        s.phone,
        s.shop_img,
        s.create_time,
        s.last_edit_time,
        s.enable_status,
        s.advice,
        a.area_id,
        a.area_name,
        sc.shop_category_id,
        sc.shop_category_name
        FROM
        tb_shop s,
        tb_area a,
        tb_shop_category sc
        <where>
            <if test="shopCondition.shopCategory!=null
				 and shopCondition.shopCategory.shopCategoryId!=null">
                and s.shop_category_id =
                #{shopCondition.shopCategory.shopCategoryId}
            </if>
            <if test="shopCondition.area!=null
				 and shopCondition.area.areaId!=null">
                and s.area_id =
                #{shopCondition.area.areaId}
            </if>
            <!-- 写like语句的时候 一般都会写成 like '% %' 在mybatis里面写就是应该是 like '%${name} %' 而不是
    '%#{name} %' ${name} 是不带单引号的，而#{name} 是带单引号的 -->
            <if test="shopCondition.shopName!=null">
                and s.shop_name like '%${shopCondition.shopName}%'
            </if>
            <if test="shopCondition.enableStatus!=null">
                and s.enable_status = #{shopCondition.enableStatus}
            </if>
            <if test="shopCondition.owner!=null and shopCondition.owner.userId!=null">
                and s.owner_id=#{shopCondition.owner.userId}
            </if>
            and
            s.area_id=a.area_id
            and
            s.shop_category_id=sc.shop_category_id
        </where>
        ORDER BY
        s.priority DESC
        LIMIT #{rowIndex},#{pageSize};
    </select>

    <select id="queryShopCount" resultType="int">
        SELECT
        count(1)
        FROM
        tb_shop s,
        tb_area a,
        tb_shop_category sc
        <where>
            <if test="shopCondition.shopCategory!=null
				 and shopCondition.shopCategory.shopCategoryId!=null">
                and s.shop_category_id =
                #{shopCondition.shopCategory.shopCategoryId}
            </if>
            <if test="shopCondition.area!=null
				 and shopCondition.area.areaId!=null">
                and s.area_id =
                #{shopCondition.area.areaId}
            </if>
            <!-- 写like语句的时候 一般都会写成 like '% %' 在mybatis里面写就是应该是 like '%${name} %' 而不是
    '%#{name} %' ${name} 是不带单引号的，而#{name} 是带单引号的 -->
            <if test="shopCondition.shopName!=null">
                and s.shop_name like '%${shopCondition.shopName}%'
            </if>
            <if test="shopCondition.enableStatus!=null">
                and s.enable_status = #{shopCondition.enableStatus}
            </if>
            <if test="shopCondition.owner!=null and shopCondition.owner.userId!=null">
                and s.owner_id=#{shopCondition.owner.userId}
            </if>
            and
            s.area_id=a.area_id
            and
            s.shop_category_id=sc.shop_category_id
        </where>
    </select>

测试

 @Test
    public void testQueryShopListAndCount(){
        Shop shopCondition = new Shop();
        PersonInfo owner = new PersonInfo();
        owner.setUserId(1L);
        shopCondition.setOwner(owner);
        List<Shop> shopList =shopDao.queryShopList(shopCondition,0,5);
        int count= shopDao.queryShopCount(shopCondition);
        System.out.println("店铺列表的大小"+shopList.size());
        System.out.println("店铺的大小："+count);
        ShopCategory sc =new ShopCategory();
        sc.setShopCategoryId(3L);
        shopCondition.setShopCategory(sc);
        shopList =shopDao.queryShopList(shopCondition,0,2);
        count =shopDao.queryShopCount(shopCondition);
        System.out.println(shopList);
        System.out.println(count);
    }

店铺列表展示之Serive层的实现

ShopService中插入

    /**
     * 根据shopCondition分页返回相应店铺列表
     * @param shopCondition
     * @param pageIndex
     * @param pageSize
     * @return
     */
    public ShopExecution getShopList(Shop shopCondition,int pageIndex,
                                     int pageSize);

在util新建PageCalculator

package com.imooc.o2o.util;

public class PageCalculator {
    public static int calculateRowIndex(int pageIndex,int pageSize){
        return (pageIndex>0)?(pageIndex-1)*pageSize:0;
    }
}

shopServiceImpl中插入

@Override
    public ShopExecution getShopList(Shop shopCondition, int pageIndex, int pageSize) {
        //得到从第几列开始
        int rowIndex = PageCalculator.calculateRowIndex(pageIndex,pageSize);
        List<Shop> shopList = shopDao.queryShopList(shopCondition,rowIndex,
                pageSize);
        //获取总数
        int count = shopDao.queryShopCount(shopCondition);
        ShopExecution se = new ShopExecution();
        if(shopList!=null){
            se.setShopList(shopList);
            se.setCount(count);
        }else{
            se.setState(ShopStateEnum.INNER_ERROR.getState());
        }
        return se;
    }

测试

    @Test
    public void testGetShopList(){
        Shop shopCondition = new Shop();
        ShopCategory sc = new ShopCategory();
        sc.setShopCategoryId(1L);
        shopCondition.setShopCategory(sc);
        ShopExecution se = shopService.getShopList(shopCondition,3,5);
        System.out.println("店铺列表数为"+se.getShopList().size());
        System.out.println("店铺总数为"+se.getCount());
    }

店铺列表展示之Contoller层的实现

在ShopManagementController.java插入以下代码，根据用户信息获取店铺列表

@RequestMapping(value = "/getshoplist",method = RequestMethod.GET)
    @ResponseBody
    private Map<String,Object>getShopList(HttpServletRequest request){
        Map<String,Object> modelMap = new HashMap<String,Object>();
        //获取用户信息
        PersonInfo user = new PersonInfo();
        user.setUserId(1L);
        user.setName("test");
        request.getSession().setAttribute("user",user);
         user =(PersonInfo)request.getSession().getAttribute("user");

         try{
             //获取用户店铺列表
             Shop shopCondition = new Shop();
             shopCondition.setOwner(user);
             ShopExecution se = shopService.getShopList(shopCondition,0,
                     100);
             modelMap.put("shopList",se.getShopList());
             modelMap.put("user",user);
             modelMap.put("success",true);
         }catch (Exception e){
             modelMap.put("success",false);
             modelMap.put("errMsg",e.getMessage());
         }
         return modelMap;
    }

在ShopManagementController.java插入以下代码管理session相关操作 

 @RequestMapping(value = "/getshopmanagementinfo",method = RequestMethod.GET)
    @ResponseBody
    private Map<String,Object> getShopManagementInfo(HttpServletRequest request){
        //管理session相关的操作
        Map<String,Object> modelMap = new HashMap<String,Object>();
        //获取店铺id
        long shopId = HttpServletRequestUtil.getLong(request,"shopId");
        if(shopId<=0){
            //如果前端没有传id的话就从seesion中获取
            Object currentShopObj = request.getSession().getAttribute(
                    "currentShop");
            if(currentShopObj==null){
                //重定向 没登录就直接到/shoplist店铺列表中
                modelMap.put("redirect",true);
                modelMap.put("url","/shop/shoplist");
            }else {
                Shop currentShop= (Shop)currentShopObj;
                modelMap.put("redirect",false);
                modelMap.put("shopId",currentShop.getShopId());
            }
        }else {
            Shop currentShop = new Shop();
            currentShop.setShopId(shopId);
            request.getSession().setAttribute("currentShop",currentShop);
            modelMap.put("redirect",false);
        }
        return modelMap;
    }

店铺列表展示前端开发

shoplist.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/shoplist.css">
</head>
<body>
<header class="bar bar-nav">
    <h1 class="title">商店列表</h1>
</header>
<div class="content">
    <div class="content-block">
        <p>你好,<span id="user-name"></span>
            <a class="pull-right" href="/shopadmin/shopoperation">增加店铺</a>
        </p>
        <div class="row row-shop">
            <div class="col-40">商店名称</div>
            <div class="col-40">状态</div>
            <div class="col-20">操作</div>
        </div>
        <div class="shop-wrap">

        </div>
    </div>
    <div class="content-block">
        <div class="row">
            <div class="col-50">
                <a href="" id="log-out"
                   class="button button-big button-fill button-danger">退出系统</a>
            </div>
            <div class="col-50">
                <a href="/myo2o/shop/changepsw" class="button button-big button-fill button-success">修改密码</a>
            </div>
        </div>
    </div>
</div>



<script type='text/javascript' src='//g.alicdn.com/sj/lib/zepto/zepto.min.js' charset='utf-8'></script>
<script type='text/javascript' src='//g.alicdn.com/msui/sm/0.6.2/js/sm.min.js' charset='utf-8'></script>
<script type='text/javascript' src='//g.alicdn.com/msui/sm/0.6.2/js/sm-extend.min.js' charset='utf-8'></script>
<script type='text/javascript' src='../resources/js/shop/shoplist.js' charset='utf-8'></script>
</body>
</html>

shoplist.css

.row-shop {
    border: 1px solid #999;
    padding: .5rem;
    border-bottom: none;
}
.row-shop:last-child {
    border-bottom: 1px solid #999;
}
.shop-name {
    white-space: nowrap;
    overflow-x: scroll;
}
.shop-wrap a {

}

shoplist.js

$(function () {
    getlist();
    function getlist(e) {
        $.ajax({
            url:"/shopadmin/getshoplist",
            type:"get",
            dateType:"json",
            success:function (date) {
                if(date.success){
                    handleList(date.shopList);
                    handleUser(date.user);
                }
            }
        });
    }
    function handleUser(data) {
        $('#user-name').text(data.name);
    }

    function handleList(data) {
        var html ='';
        data.map(function (item,index) {
            html+='<div class="row row-shop"><div class="col-40">'
                +item.shopName+'</div><div class="col-40">'
                +shopStatus(item.enableStatus)
                +'</div><div class="col-20">'
                +goShop(item.enableStatus,item.shopId)+'</div></div>';
        });
        $('.shop-wrap').html(html);
    }

    function shopStatus(status) {
        if(status==0){
            return '审核中';
        }else if(status ==-1){
            return '店铺非法';
        }else if(status==1){
            return '审核通过';
        }
    }

    function goShop(status,id) {
        if(status==1){
            return'<a href="/shop/shopmanage?shopId='+id+'">进入</a>';
        }else {
            return '';
        }
    }
});

shopAdminController

package com.imooc.o2o.web.shopadmin;

import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestMethod;

@Controller
@RequestMapping(value = "shopadmin",method = {RequestMethod.GET})
public class ShopAdminController {
    @RequestMapping(value = "/shopoperation")
    public String shopOperation(){
        return "shop/shopoperation";
    }

    @RequestMapping(value = "/shoplist")
    public String shopList(){
        return "shop/shoplist";
    }
}

店铺管理页面的前端开发

shopmanagement.html导入css文件和commonutil.js和shopmanage.js文件

<!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/shopmanage.css">
</head>
<body>
<header class="bar bar-nav">
    <h1 class="title">商店管理</h1>
</header>
<div class="content">
    <div class="content-block">
        <div class="row">
            <div class="col-50 mb">
                <a href="/shop/shopedit" class="button button-big button-fill">商铺信息</a>
            </div>
            <div class="col-50 mb">
                <a href="/shop/productmanage" class="button button-big button-fill">商品管理</a>
            </div>
            <div class="col-50 mb">
                <a href="/shop/productcategorymanage" class="button button-big button-fill">类别管理</a>
            </div>
            <div class="col-100 mb">
                <a href="/shop/shoplist" class="button button-big button-fill button-danger">返回</a>
            </div>
        </div>
    </div>
</div>



<script type='text/javascript' src='//g.alicdn.com/sj/lib/zepto/zepto.min.js' charset='utf-8'></script>
<script type='text/javascript' src='//g.alicdn.com/msui/sm/0.6.2/js/sm.min.js' charset='utf-8'></script>
<script type='text/javascript' src='//g.alicdn.com/msui/sm/0.6.2/js/sm-extend.min.js' charset='utf-8'></script>
<script type='text/javascript' src='../resources/js/shop/shopmanage.js' charset='utf-8'></script>
<script type='text/javascript'
        src='../resources/js/common/commonutil.js' charset='utf-8'></script>
</body>
</html>

shopmanage.js

$(function () {
    var shopId = getQueryString('shopId');
    var shopInfoUrl="/shopadmin/getshopmanagementinfo?shopId="+shopId;
    $.getJSON(shopInfoUrl,function (data) {
        if(data.redirect){
            window.location.href=data.url;
        }else{
            if(data.shopId!=undefined&&data.shopId!=null){
                shopId=data.shopId;
            }
            $('#shopInfo').attr('href','/shopadmin/shopoperation?shopId='+shopId);
        }
    });
});

commonutil.js 

function changeVerifyCode(img) {
    img.src="../Kaptcha?"+Math.floor(Math.random()*100);
}

function getQueryString(name){
    var reg = new RegExp("(^|&)"+name+"=([^&]*)(&|$)");
    var r = window.location.search.substr(1).match(reg);
    if(r!=null){
        return decodeURIComponent(r[2]);
    }
    return '';
}

shopadminController.java加入

    @RequestMapping(value = "/shopmanagement")
    public String shopManagement(){
        return "shop/shopmanagement";
    }

进入/shopmanagement会自动重定向