SSM项目之商铺系统-店铺信息编辑(十三)

这一部分我们要完成店铺的信息修改，我们修改店铺时肯定是修改某个店铺，而这个店铺在前端一般都是点进来的，那么前端在点进来的时候就会带着相应的店铺信息（这里具体来说就是shopId），那么进入这个商品编辑模块时候，肯定要显示原来的信息,根据原来的信息进行修改，这里要注意的是有的信息在创建好时就不能再修改，并且我们在修改时没有必要看到拥有者的信息。

如：

    接下来实践：

首先是DAO层:因为前台传来了所需要改变的shopid。那么我们就完成一个通过店铺id来查询并将店铺信息返回。

首先DAO接口：

如前所说，我们传入了一个shopId，通过shopId查询店铺信息

接下来是mapper.xml文件的实现。

由于Shop的属性有符合类型，我们需要用到resultMap的associate标签

 <!--查询shop的信息，通过shopId，因为还要查出来shop的categoryName等信息，我们用resultMap-->
    <resultMap id="shopMap" type="shop">
        <!--基本类型查询-->
        <id column="shop_id" property="shopId" />
        <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="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="owner" column="user_id" javaType="personinfo">
            <id column="user_id" property="userId"></id>
            <result column="name" property="name"></result>
        </association>
        <association property="area" column="area_id" javaType="area">
            <id column="area_id" property="areaId"></id>
            <result column="area_name" property="areaName"></result>
        </association>
        <association property="shopCategory" column="shop_categoryId" javaType="shopCategory">
            <id column="shop_category_id" property="shopCategoryId"></id>
            <result column="shop_category_name" property="shopCategoryName"></result>
        </association>
    </resultMap>


 <!--查询店铺语句，不希望获取店铺拥有人-->
    <!-- 不希望获取PersonInfo的信息，所以SQL中没有关联tb_person -->
    <select id="queryByShopId" resultMap="shopMap" parameterType="Long">
        	SELECT
			s.shop_id,
			s.shop_name,
			s.shop_desc,
			s.shop_addr,
			s.phone,
			s.shop_img,
			s.priority,
			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.area_id = a.area_id
		AND s.shop_category_id = sc.shop_category_id
		AND s.shop_id =  #{shopId}


    </select>

此时查出了所有的信息

接下来实现service层：

我们看service实现：

 /*
    * 根据shopid获取shop信息
    * */
    @Transactional
    public Shop getByShopId(Long shopId){
      return shopDao.queryByShopId(shopId);
    }

我们的service层并没有什么要实现的，因为这个功能只是简单的查询没什么需要增加的功能

controller层：

  /*
    * 根据相应的店铺id获取相应的店铺信息
    * */
    @RequestMapping(value = "getshopbyid",method = RequestMethod.GET)
    @ResponseBody
    public  Map<String,Object> getShopById(HttpServletRequest request){
          Map<String,Object> modelmap=new HashMap<String,Object>();//存放数据的格式
          Long shopId=HttpServletRequestUtil.getLong(request,"shopId");//先将前台获取的id转为Long型，才能操作
          //我们需要查询店铺信息和地域列表信息
        if (shopId>-1) {
            try {
                Shop shop = shopService.getByShopId(shopId);//查询店铺信息
                List<Area> areaList = areaService.getAreaList();//获取店铺列表
                modelmap.put("shop", 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","emptyshopId");
        }
        return  modelmap;
    }

步骤：我们首先判断接受的shopid是否可用，如果可用我们就调用service层的方法从数据库获得shop信息和地域信息（因为是下拉框，所以要查询出所有地区），

并将查询的信息存入新建的shop对象，然后通过map返回给前端，如果捕捉到错误抛出处理。

VIEW层：

概述

按照设计，有如下几个点

• 修改商铺和注册商铺肯定是一个页面，这个毋庸置疑

• 商铺名称不能修改，店铺类别不能修改，其余信息可编辑修改

• 修改商铺的时候，图片上传不是必须的

• 需要动态的根据URL来判断是注册还是修改店铺

步骤

首先新增两个url

/o2o/src/main/webapp/resources/js/shop/shopoperation.js

<span style="color:#000000"><code>    <span style="color:#880000">// 通过shopId获取商铺信息的URL</span>
    <span style="color:#000088">var</span> getShopInfoByShopId = <span style="color:#009900">'/o2o/shopadmin/getshopinfobyId?shopId='</span> + shopId;
    <span style="color:#880000">// 修改商铺的URL</span>
    <span style="color:#000088">var</span> modifyShopUrl = <span style="color:#009900">'/o2o/shopadmin/modifyshop'</span>;</code></span>

shopId 如何获取呢？

/o2o/src/main/webapp/resources/js/common/common.js中写个公共方法

<span style="color:#000000"><code>
<span style="color:#000088">function</span> <span style="color:#009900">getQueryString</span><span style="color:#4f4f4f">(name)</span> {
    <span style="color:#000088">var</span> reg = <span style="color:#000088">new</span> <span style="color:#4f4f4f">RegExp</span>(<span style="color:#009900">"(^|&)"</span> + name + <span style="color:#009900">"=([^&]*)(&|$)"</span>);
    <span style="color:#000088">var</span> r = window.location.search.substr(<span style="color:#006666">1</span>).match(reg);
    <span style="color:#000088">if</span> (r != <span style="color:#006666">null</span>) {
        <span style="color:#000088">return</span> <span style="color:#4f4f4f">decodeURIComponent</span>(r[<span style="color:#006666">2</span>]);
    }
    <span style="color:#000088">return</span> <span style="color:#009900">''</span>;
}</code></span>

在shopoperation.js 调用即可，同时根据请求的URL来判断是注册还是编辑商铺。

<span style="color:#000000"><code>    <span style="color:#880000">// 通过url是否含有shopId来判断是注册还是编辑商铺</span>
    <span style="color:#000088">var</span> shopId  = getQueryString(<span style="color:#009900">'shopId'</span>);
    <span style="color:#880000">// shopId非空返回true，空者返回false</span>
    <span style="color:#000088">var</span> isEdit = shopId ? <span style="color:#000088">true</span> :<span style="color:#000088">false</span>;

    <span style="color:#880000">// 根据isEdit 来判断 是注册商品还是修改商铺</span>
    <span style="color:#000088">if</span>(!isEdit){
        <span style="color:#880000">// 调用getShopInitInfo，注册店铺用</span>
        getShopInitInfo();
    }<span style="color:#000088">else</span>{
        <span style="color:#880000">// 调用getShopInfoById，修改店铺用</span>
        getShopInfoById(shopId);
    }</code></span>

编写getShopInfoById(shopId);

<span style="color:#000000"><code><span style="color:#880000">/**
     * 通过shopId获取shop信息
     */</span>
    <span style="color:#000088">function</span> <span style="color:#009900">getShopInfoById</span><span style="color:#4f4f4f">(shopId)</span>{
        $.getJSON(getShopInfoByShopId,<span style="color:#000088">function</span><span style="color:#4f4f4f">(data)</span>{
            <span style="color:#000088">if</span>(data.success){
                <span style="color:#880000">// 将后台返回的shop通过shop变量接收，方便赋值</span>
                <span style="color:#000088">var</span> shop =  data.shop;
                <span style="color:#880000">// 赋值   要和shop实体类中的属性名保持一致</span>
                $(<span style="color:#009900">'#shop-name'</span>).val(shop.shopName);
                $(<span style="color:#009900">'#shop-name'</span>).attr(<span style="color:#009900">'disabled'</span>,<span style="color:#009900">'disabled'</span>);
                $(<span style="color:#009900">'#shop-addr'</span>).val(shop.shopAddr);
                $(<span style="color:#009900">'#shop-phone'</span>).val(shop.phone);
                $(<span style="color:#009900">'#shop-desc'</span>).val(shop.shopDesc);

                <span style="color:#880000">// 商品目录进行赋值   商品目录仅仅加载对应的目录，且不可编辑</span>
                <span style="color:#000088">var</span> shopCategory = <span style="color:#009900">'<option data-id="'</span>
                    +shop.shopCategory.shopCategoryId + <span style="color:#009900">'" selected>'</span>
                    +shop.shopCategory.shopCategoryName +<span style="color:#009900">'</option>'</span>;
                $(<span style="color:#009900">'#shop-category'</span>).html(shopCategory);
                <span style="color:#880000">// 设置为不可编辑</span>
                $(<span style="color:#009900">'#shop-category'</span>).attr(<span style="color:#009900">'disabled'</span>,<span style="color:#009900">'disabled'</span>);

                <span style="color:#880000">// 区域进行赋值  区域可以进行编辑，并且初始设置为后台对应的区域</span>
                <span style="color:#000088">var</span> tempShopAreaHtml = <span style="color:#009900">''</span>;
                data.areaList.map(<span style="color:#000088">function</span><span style="color:#4f4f4f">(item, index)</span> {
                    tempShopAreaHtml += <span style="color:#009900">'<option data-id="'</span> + item.areaId
                            + <span style="color:#009900">'">'</span> + item.areaName + <span style="color:#009900">'</option>'</span>;
                });
                $(<span style="color:#009900">'#shop-area'</span>).html(tempShopAreaHtml);
                <span style="color:#880000">//初始设置为后台对应的区域 </span>
                $(<span style="color:#009900">"#shop-area option[data-id='"</span>+shop.area.areaId+<span style="color:#009900">"']"</span>).attr(<span style="color:#009900">"selected"</span>,<span style="color:#009900">"selected"</span>);

            }<span style="color:#000088">else</span>{
                $.toast(data.errMsg);
            }
        });
    };
</code></span>

submit方法修改

<span style="color:#000000"><code><span style="color:#880000">// 如果是编辑，需要传入shopId</span>
<span style="color:#000088">if</span>(isEdit){
   shop<span style="color:#4f4f4f">.</span>shopId<span style="color:#4f4f4f">=</span>shopId;
          }


...<span style="color:#4f4f4f">..</span> 省略，注意url处的修改

<span style="color:#880000">// 利用ajax提交</span>
        $<span style="color:#4f4f4f">.</span>ajax({
            <span style="color:#880000">// 动态判断 url</span>
            url:isEdit <span style="color:#4f4f4f">?</span> modifyShopUrl:registerShopUrl,
            <span style="color:#000088">type</span>:<span style="color:#009900">'POST'</span>,
            <span style="color:#4f4f4f">data</span>:formData,
            contentType:<span style="color:#006666">false</span>,
            processData:<span style="color:#006666">false</span>,
            <span style="color:#000088">cache</span>:<span style="color:#006666">false</span>,
            success:function(<span style="color:#4f4f4f">data</span>){
                <span style="color:#000088">if</span>(<span style="color:#4f4f4f">data</span><span style="color:#4f4f4f">.</span>success){
                    $<span style="color:#4f4f4f">.</span>toast(<span style="color:#009900">'提示信息:'</span><span style="color:#4f4f4f">+</span><span style="color:#4f4f4f">data</span><span style="color:#4f4f4f">.</span>errMsg);
                }<span style="color:#000088">else</span>{
                    $<span style="color:#4f4f4f">.</span>toast(<span style="color:#009900">'提示信息:'</span> <span style="color:#4f4f4f">+</span> <span style="color:#4f4f4f">data</span><span style="color:#4f4f4f">.</span>errMsg);
                }
                <span style="color:#880000">// 点击提交后 不管成功失败都更换验证码，防止重复提交</span>
                $(<span style="color:#009900">'#kaptcha_img'</span>)<span style="color:#4f4f4f">.</span>click();
            }
        });
</code></span>

view层转自

https://blog.csdn.net/yangshangwei/article/details/80583706