在新公司，前端和后台的模块又是一个人处理；
分到了做一个模块的修改功能。直接进入主题：下面开始先从前端开始描述：
1.前端页面复用了新增的页面，剩下的进行修改。首先是通过ID发送给后台，查询到该ID下的所有的其他属性。方法如下：

 //获取仓库物资详情
      getDetail(){
        let self = this;
        materialInquiry.getWarehouseGoodsDetail(self.warehouseGoodsId).then(function(response){
          self.ruleForm = response.body.data;
          console.log(response.body.data)
        });
      },

1.2，配置该url的路由，以便发送到后台：

/**
   * 获取仓库物资详情
   */
  getWarehouseGoodsDetail(id){
    return Vue.http.get(context.oms + "/material/goods/v1/stocks/" + id);
  },

1.3 定义我们需要的对象属性：

data(){
      return {
        warehouseGoodsId: null,
        currentGoodsId:null,
        typeNameList:[],
        warehouseList:[],
        /**
         * 表单
         */
        ruleForm:{
          goodsName: '',
          packUnit: '',
          brand: '',
          minUnit: '',
          model: '',
          scaleFactor: null,
          remark: '',
          typeName: ''
        }
      }
    },

1.4然后将获得的对象分别绑定到对应的属性中

2.接下来的步骤就是，通过双向绑定原理，给对象赋新值，然后将对象封装，通过URL传送到后台。

通过submit。将ruleForm对象的新值传到后台。

  //提交数据
      submit(ruleForm) {
        let self = this;
        this.$refs[ruleForm].validate((valid) => {
          if (valid) {
            materialInquiry.updateGoods(self.ruleForm).then(
              (response) => {
                if (response.body.status == 200) {
                  self.$message({
                    message: '物资修改成功',
                    type: 'success'
                  });
                  self.$router.push({name:"materialInquiryYLY"});
                } else{
                  self.$message({
                    message: response.body.message,
                    type: 'error'
                  })
                }
              }, (response) =>{
                self.$message({
                  message: '物资修改失败',
                  type: 'error'
                })
              }
            );
          } else {
            return false;
          }
        });
      }

    },

2.2 当然，还有路由的配置：

/**
   * 修改物资信息
   * @param val
   */
  updateGoods(val){
    return Vue.http.post(context.oms+"/material/goods/v1/updateGood",val);
  },

前端代码描述完毕。
接下来解析后台代码。
3.1 后台获取详情的controller层：

代码也很好理解：

 @GET(value = "v1/stocks/{warehouseGoodsId}")
    @ApiOperation(httpMethod = "GET", value = "获取仓库物资详情",response=WarehouseGoodsDTO.class)
    public String getWarehouseGoodsDetail(
            @ApiParam(name = "warehouseGoodsId", value = "仓库物资id", required = true) @PathVariable("warehouseGoodsId") Long warehouseGoodsId) {
        WarehouseGoodsDTO detail = warehouseGoodsService.getDetail(warehouseGoodsId);
        return ResultContent(ResultStatus.SUCCESS, detail);
    }

3.2service层的接口和实现如下：

 WarehouseGoodsDTO getDetail(Long warehouseGoodsId);

实现：

  @Override
    public WarehouseGoodsDTO getDetail(Long warehouseGoodsId){
        WarehouseGoodsDTO detail = this.dao.findDetail(warehouseGoodsId);
        detail.setPackStockNum(detail.getStockNum() / detail.getScaleFactor());
        return detail;
    }

3.3 dao的接口和 .xml的写法如下：

WarehouseGoodsDTO findDetail(@Param("warehouseGoodsId") Long warehouseGoodsId);

SQL的XML代码如下：

<select id="findDetail" resultType="com.xksh.pension.material.dto.WarehouseGoodsDTO">
        SELECT  wg.WAREHOUSE_GOODS_ID AS warehouseGoodsId,
                wg.WAREHOUSE_ID AS warehouseId,
                wg.GOODS_ID AS goodsId,
                g.GOODS_NAME AS goodsName,
                w.WAREHOUSE_NAME AS warehouseName,
                g.BRAND AS brand,
                g.MODEL AS model,
                g.PACK_UNIT AS packUnit,
                g.SCALE_FACTOR AS scaleFactor,
                g.MIN_UNIT AS minUnit,
                wg.STOCK_NUM AS stockNum,
                wg.MIN_STOCK_NUM AS minStockNum,
                wg.LOCATION AS location,
                g.sell_price AS sellPrice,
                  g.`TYPE_NAME` AS typeName,
                g.REMARK AS remark
        FROM    tb_material_warehouse_goods wg
        LEFT JOIN tb_material_goods g ON wg.GOODS_ID=g.GOODS_ID
        LEFT JOIN tb_material_warehouse w ON wg.WAREHOUSE_ID=w.WAREHOUSE_ID
        WHERE   wg.WAREHOUSE_GOODS_ID = #{warehouseGoodsId}
    </select>

4.重头戏，修改的后台过程如下：
4.1controller的写法：

代码如下：

 @POST(value = "v1/updateGood")
    @ApiOperation(httpMethod = "POST", value = "修改物资信息")
    public String update(@ApiParam(name = "goodsDTO", value = "物资信息", required = false) @RequestBody GoodsDTO goodsDTO){
        //数据校验
        ValidationResult valid = validate(goodsDTO);
        if (!valid.isPass()) {
            return ResultContent(ResultStatus.BEAN_VALID_FAILED, valid.getErrorMessage());
        }
        try {
            goodsService.update(goodsDTO);
        }
        catch (Exception e){
            logger.error("物资修改失败：", e);
            return ResultContent(ResultStatus.OPER_FAILD);
        }

        return ResultContent(ResultStatus.SUCCESS, valid);
    }

4.2service的接口和实现：

 /**
     * 更新物资信息
     * @param goodsDTO
     * @return
     */
    int update(GoodsDTO goodsDTO);

实现：

代码：

@Override
    public int update(GoodsDTO goodsDTO) {
        GoodsDO goodsDO = new GoodsDO();
        BeanUtils.copyProperties(goodsDTO, goodsDO);
        return  this.dao.updateByPrimaryKeySelective(goodsDO);
    }

由于封装或者其他的原因。dao的接口不需要写，直接调用。
至此，进行一次模块的修改记录完成。从前端到后台的一次修改的全过程！！！