【ruoyi-vue】在代码生成的基础上新增自定义接口以及匿名访问测试接口

后端新增自定义接口

使用ruoyi-vue3.8.2

以在总工序表中筛选出所有id与process_name为例,接口名为allProcedureIdsAndNames

如图为其数据库表

如图为其具体字段记录

controller

@RestController
@RequestMapping("/system/aprocedure")
public class AprocedureController extends BaseController
{
    //其他代码

    //其他代码
    
    /**
     * 获取所有工序的 id 和名称
     *
     * @return 包含 id 和名称的工序列表
     */
    @GetMapping("/allProcedureIdsAndNames")
    public List<Aprocedure> getAllProcedureIdsAndNames() {
        return aprocedureService.selectAllProcedureIdsAndNames();
    }
}

service

public interface IAprocedureService 
{
    //其他代码
    //其他代码

    /**
     * 查询所有工序的 id 和名称
     *
     * @return 包含 id 和名称的工序列表
     */
    public List<Aprocedure> selectAllProcedureIdsAndNames();
}

servicelmpl

@Service
public class AprocedureServiceImpl implements IAprocedureService 
{
    //其他代码

    //其他代码


    /**
     * 查询所有工序的 id 和名称
     *
     * @return 包含 id 和名称的工序列表
     */
    @Override
    public List<Aprocedure> selectAllProcedureIdsAndNames() {
        return aprocedureMapper.selectAllProcedureIdsAndNames();
    }

}

mapper.java

public interface AprocedureMapper 
{

    //其他代码
    //其他代码

    public int deleteAprocedureByIds(Long[] ids);

    /**
     * 查询所有工序的 id 和名称
     *
     * @return 包含 id 和名称的工序列表
     */
    public List<Aprocedure> selectAllProcedureIdsAndNames();

}

domain 自定义resultType

用于xml，接口最后返回值的样式

首先在com.ruoyi.system.domain，创建java类ProcedureInfo，添加对应get和setter方法，如下列代码

package com.ruoyi.system.domain;

public class ProcedureInfo {
    private Long id;
    private String processName;

    // getters and setters...

    public Long getId() {
        return id;
    }

    public void setId(Long id) {
        this.id = id;
    }

    public String getProcessName() {
        return processName;
    }

    public void setProcessName(String processName) {
        this.processName = processName;
    }
}

mapper.xml

<mapper namespace="com.ruoyi.system.mapper.AprocedureMapper">

//其他代码

//其他代码

    <select id="selectAllProcedureIdsAndNames" resultType="ProcedureInfo">
        SELECT id, process_name AS processName FROM aprocedure
    </select>
    
</mapper>

匿名访问测试接口

首先找到src/main/java/com/ruoyi/framework/config/SecurityConfig.java

@Override
protected void configure(HttpSecurity http) throws Exception {
    httpSecurity
        // ...其他配置...
        // ...其他配置...



        .authorizeRequests() //配置请求权限

            .antMatchers("/system/aprocedure/allProcedureIdsAndNames").permitAll()  // 允许匿名访问这个接口


            .anyRequest().authenticated()  // 其他请求需要认证
        // ...其他配置...
        // ...其他配置...

}

postman测试

前端使用接口

api设置

ruoyi-ui/src/api/system/aprocedure.js

新增接口及调用示例

// 调用新增的接口来获取所有工序的 id 和名称
function getAllAprocedureIdAndName() {
  return request({
    url: '/system/aprocedure/allIdAndName',
    method: 'get'
  })
}

// 调用示例
getAllAprocedureIdAndName().then(response => {
  // 处理响应数据
  console.log(response.data);
}).catch(error => {
  // 处理错误
  console.error('获取工序 ID 和名称失败：', error);
});

页面调用

ruoyi-ui/src/views/system/aprocedure/index.vue

最终返回在aprocedureListIdAndName中

getProcedureList() {
  this.loading = true;
  getAllAprocedureIdAndName().then(response => {
    this.aprocedureListIdAndName= response.data;  // 使用返回的数据
    this.total = response.data.length;  // 使用返回的数据的长度作为总数
    this.loading = false;
  }).catch(error => {
    console.error('获取工序 ID 和名称失败：', error);
    this.loading = false;
  });
}