4、cool-admin搜索和新增的修改

最新推荐文章于 2025-10-20 08:45:09 发布

原创

最新推荐文章于 2025-10-20 08:45:09 发布 · 871 阅读

7 ·

CC 4.0 BY-SA版权

文章标签：

#javascript

文章目录

前言
一、搜索功能
二、新增功能

前言

因为搜索功能还没有，新增按钮不太符合我的需求，所以需要修改一下。

一、搜索功能

为了方便，我提前新增了两条数据。可以看到，现在的搜索功能是没有实现的
在这里插入图片描述
只需要在后端代码 src/controller/admin/category.ts 中的@CoolController 里加上以下代码即可实现搜索

  pageQueryOp: {
    keyWordLikeFields: ['name'],
  },

完整代码如下：

@CoolController({
   
   
 api: ['add', 'delete', 'update', 'info', 'list', 'page'],
 entity: VideoCategoryEntity,
 pageQueryOp: {
   
   
   keyWordLikeFields: ['name'],
 },
})

二、新增功能

可以看到自动生成的新增功能是很简陋的，我想要的是新增时可以根据上级分类的名称来选择，分类等级不需要自己填写，选择了上级分类之后自己就可以计算出来。所以现在我们要到前端页面去改造一下。为了后续测试，我们可以再多增几条数据上去。
在这里插入图片描述
这是现在的数据，我一共添加了12条

我们可以在前端代码 src/video/view/category.vue中进行修改。
根据官方文档可以很简单进行修改

因此我们的代码可以修改为

  {
   
   
      label: "父节点id，根节点为0",
      prop: "categoryList",
      hook: "number",
      component: {
   
   
        name: "el-select",
        options: [],
      },
      required: true,
    }

async onOpen() {
   
   
    service.video.category.list().then((res) => {
   
   
      Upsert.value?.setOptions(
        "categoryList",
        res.map((e) => {
   
   
          return {
   
   
            label: e.name || "",
            value: e.