Ant Design Pro Vue 時間段查詢 問題

<a-form-item
label="起止日期"
:labelCol="{lg: {span: 7}, sm: {span: 7}}"
:wrapperCol="{lg: {span: 10}, sm: {span: 17} }">
<a-range-picker
  name="buildTime"
  style="width: 100%" v-model="queryParam.date"
   v-decorator="[
    'buildTime',
    {rules: [{ required: true, message: '請選擇起止日期' }]}
  ]" />
</a-form-item>

查詢的時候，URL地址會變成

his/list/advice?pageNo=1&pageSize=10&status=0&date[]=2019-11-26&date[]=2019-11-27

不符合URL規范

---

 

import { axios } from '@/utils/request'
import Mock from 'mockjs2'
import qs from 'qs'
 

const api = {  
  adviceList: '/mongo/his/list/advice',   
}

export default api


export function getAdviceList (parameter) {      
  console.log('loadData.parameter =>', parameter)  
  if(parameter.date!=null && parameter.date.length>1){      
    //parameter.date = ['2019-11-17','2019-11-20']
    parameter.date = [parameter.date[0].format('YYYY-MM-DD'),parameter.date[1].format('YYYY-MM-DD')]    
    parameter.date = qs.stringify(parameter.date, { indices: false })
    
    console.log('loadData.parameter.date =>', parameter.date) 
  } 
  return axios({
    url: api.adviceList,
    method: 'get',
    params: parameter
  })
} 

1.日期轉字符串

2.數組轉字符串 qs.stringify

注意：v-model="queryParam.date" 用的是moment，他是個對象，所在qs.stringify 的時候，要把它format成需要的字符串格式，重拼成數組，再用 qs.stringif轉一下

parameter.date = ['2019-11-17','2019-11-20']
通過parameter.date = qs.stringify(parameter.date, { indices: false })
轉換后，會得到 his/list/advice?pageNo=1&pageSize=10&status=0&date=0=2019-11-17&1=2019-11-20

后台

 

private Criteria buildCriteria(HttpServletRequest request) { 
    String date = request.getParameter("date");        
    if (StringUtil.isNotEmpty(keyword)) {
        criteria.add(SyncAdvice.CONTENT, OP.LIKE, keyword);
    }
    if (StringUtil.isNotEmpty(date)) {
//            Date dt = DateUtil.convert("yyyy-MM-dd'T'HH:mm:ss.SSS'Z'", date.replace("\"", ""));
//            Date dtBegin = DateUtil.getDateAt0(dt);
//            Date dtEnd = DateUtil.getDateAt24(dt);
//            String dt = "0=2019-11-08&1=2019-11-15";
        String[] sp = date.split("&");
        if(sp.length>1){
            String[] dtBeginArr = sp[0].split("=");
            String[] dtEndArr = sp[1].split("=");
            String dtBeginStr=dtBeginArr[1].toString();
            String dtEndStr=dtEndArr[1].toString();
            Date dtB = DateUtil.convert("yyyy-MM-dd", dtBeginStr);
            Date dtE = DateUtil.convert("yyyy-MM-dd", dtEndStr);
            Date dtBegin = DateUtil.getDateAt0(dtB);
            Date dtEnd = DateUtil.getDateAt24(dtE);
            criteria.add(SyncAdvice.CREATE_TIME, OP.GE, DateUtil.toFormatString("yyyy-MM-dd'T'HH:mm:ss.SSS'Z'", dtBegin));
            criteria.add(SyncAdvice.CREATE_TIME, OP.LE, DateUtil.toFormatString("yyyy-MM-dd'T'HH:mm:ss.SSS'Z'", dtEnd));
        }
    }
    return criteria;
}

效果如下