Springboot+Easyui ——根据商品ID查找商品的类别（商品上下架状态情况）

一、显示效果

 二、前端代码

<table class="easyui-datagrid" id="itemList" title="商品列表" 
       data-options="singleSelect:false,fitColumns:true,collapsible:true,pagination:true,url:'/item/query',method:'get',pageSize:20,toolbar:toolbar">
    <thead>
        <tr>
            <th data-options="field:'ck',checkbox:true"></th>
            <th data-options="field:'id',width:60">商品ID</th>
            <th data-options="field:'title',width:200">商品标题</th>
            <th data-options="field:'cid',width:100,align:'center',formatter:KindEditorUtil.findItemCatName">叶子类目</th>
            <th data-options="field:'sellPoint',width:100">卖点</th>
            <th data-options="field:'price',width:70,align:'right',formatter:KindEditorUtil.formatPrice">价格</th>
            <th data-options="field:'num',width:70,align:'right'">库存数量</th>
            <th data-options="field:'barcode',width:100">条形码</th>
            <th data-options="field:'status',width:60,align:'center',formatter:KindEditorUtil.formatItemStatus">状态</th>
            <th data-options="field:'created',width:130,align:'center',formatter:KindEditorUtil.formatDateTime">创建日期</th>

            <th data-options="field:'updated',width:130,align:'center',formatter:KindEditorUtil.formatDateTime">更新日期</th>
        </tr>
    </thead>
</table>

三，js代码

　　拓展：了解formatter属性

  <th data-options="field:'cid',width:100,align:'center',formatter:KindEditorUtil.findItemCatName">叶子类目</th>
  <th data-options="field:'status',width:60,align:'center',formatter:KindEditorUtil.formatItemStatus">状态</th>

　　 formatter属性支持自定义单元格内容。

　　语法：

    formatter:function(cellvalue,options,rowObject){
        return "";
    }

　　参数详解：

　　　　（1）cellvalue，当前单元格的值
　　　　（2）options，该cell的options设置，包括{rowId, colModel,pos,gid}
　　　　（3）rowObject，当前cell所在row的值，是一个对象　　

     因此只要通过formatter属性进行调用,则都会传递2个参数 参数1:当前值 参数2:行数据

//查询商品属于那种商品类别
 findItemCatName : function(val,row){
        let name = ''
        $.ajax({
            type:  "get",
            url:   "/itemCat/findItemCatById",
            data:  {id: val},
            success: function(result){
                //result要求返回的是ItemCat对象
                console.log(result)
                name=result.name;
            },
            error: function(result){
                console.log("查询失败")
            },
            async:    false
        })
        return name
    },

 

// 改变商品的状态
    formatItemStatus : function formatStatus(val,row){
        if (val == 1){
            return '<span style="color:green;">正常</span>';;
        } else if(val == 2){
            return '<span style="color:red;">下架</span>';
        } else {
            return '未知';
        }
    },

 四、后端：

 　　4.1、创建itemcat.java实体类

@TableName("tb_item_cat")
@Data
@Accessors(chain = true)
public class ItemCat extends BasePojo{

    @TableId(type = IdType.AUTO)
    private Long id;
    private Long parentId;
    private String name;
    private Integer status;
    private Integer sortOrder;  //排序号
    private Boolean isParent;   //false 0  true 1
}

　　4.2、创建itemcatmapper.java

public interface ItemCatMapper extends BaseMapper<ItemCat> {
    ItemCat findItemCatById(Long id);

}

　　4.3、创建itemcatservice.java以及itemcatserviceImpl.java

public interface ItemCatService {
    ItemCat findItemCatById(Long id);
}

@Service
public class ItemCatServiceImpl implements  ItemCatService{

    @Autowired
    private ItemCatMapper itemCatMapper;

    @Override
    public ItemCat findItemCatById(Long id) {
      /*  因为mybatisplus底层有根据id查询封装的方法，所以我们直接就调它的封装的方法
      * 根据ID查询
      *  T selectById(Serializable id);
      * */

        return itemCatMapper.selectById(id);

    }
}

　　4.4、创建itemcatcontroller

@RestController
@RequestMapping("/itemCat")
public class ItemCatController {

    @Autowired
    private ItemCatService itemCatService;

    /**
     * 业务需求: 根据商品分类Id查询商品分类对象
     * URL地址: /itemCat/findItemCatById?id=497
     * 类型: Request Method: GET
     * 参数: id
     * 返回值: ItemCat对象
     */
    @RequestMapping("/findItemCatById")
    public ItemCat findItemCatById(Long id){

        return itemCatService.findItemCatById(id);
    }

}

 来源于：https://harrylyj.blog.csdn.net/article/details/114358433?spm=1001.2014.3001.5502