前端页面多个选择器返回api接口的sql查询高效写法

表单查询过滤时，一般前端会有多个Select选择器进行下拉选择进行查询，为了减少接口请求的次数，我一般设计的时候，会尽量把下拉选择器的list数据，都汇总在一个接口，进行返回。

样式引用elementUI中的Selcet选择器，如下： 

 

 

 

-- 多个选择器下拉框汇总sql
WITH tab as (
select project from PROBLEM_MANAGE_F group by project
),
tab0 as (
select PROCESS from PROBLEM_MANAGE_F group by PROCESS
),
tab1 as (
select PRODUCT from PROBLEM_MANAGE_F group by PRODUCT
),
tab2 as (
select concat('PROJECT:','[',group_concat(project),']') as project from tab
),
tab3 as 
(
select concat('PRODUCT:','[',group_concat(PRODUCT),']') as PRODUCT from tab1
)
,
tab4 as 
(
select concat('PROCESS:','[',group_concat(PROCESS),']') as PROCESS from  tab0
)
select *from tab4,tab3,tab2 ;

实例sql中，运用了mysql8的新特性，with as 表达式表示临时表，可以把多个sql语句进行拼接使用，这里简单讲下，表单中有三列字段，是业务常用的下拉筛选，如 项目、工序、产品，通过对表单中的数据，先进行group by分组，以临时表的形式表示tab,tab0,tab1,然后再通过group_contact函数，合并每个字段的内容在一行，即将分组后可能有多个产品值，如：产品A,产品B,产品C合并（默认是逗号隔开），然后为了返回给前端更好地取值，还可以通过concat函数拼接一个固定的key值，形成如：{"PROJECT":["产品A","产品B","产品C"]}

 如上的例子，查询得到的结果就只有一条数据，三个字段，PROJECT,PRODUCT,PROCESS，内容分别就是原表对应的字段分组后用逗号拼接的多个值。

XML中的返回值就可以定义为Map类型

<select id="getSearchDropDownList" resultType="java.util.Map">

Mapper中的方法返回值，因为数据只有一条所以可以直接返回Map

public Map<String,List<String>> getSearchDropDownList();

另外如果xml返回的是Map,数据有多条情况下，Mapper对应的方法的返回值则需要用List

public Lsit<Map<String,Object>> getSearchDropDownList();

List中再嵌套List,业务场景中需要注意，有时会报错没有这种参数类型支持