elementUI 时间选择器，时间选择快捷键

elementUI的时间快捷键，使用属性:picker-options="pickerOptions"，由于pickerOptions的定义很长，也在其他地方共用，因此建议提取出来在公用文件定义，再在页面直接引用。

1、定义元素

 1     <el-date-picker
 2               style="width: 440px;"
 3               v-model="timeQuery"
 4               type="datetimerange"
 5               popper-class="myDatePickerCls"
 6               :clearable=false
 7               :picker-options="pickerOptions"
 8               @change="handleClearFilter('timeQuery')"
 9               range-separator="至"
10               start-placeholder="开始日期"
11               end-placeholder="结束日期"
12               align="right">
13     </el-date-picker>    

2、再外部定义一个js文件，并定义快捷键的方法：

 1 // 搜索时间下拉框，快捷键
 2 export const pickerOptionsTimeEle = [{
 3     text: '今天（此刻）',
 4     onClick(picker) {
 5       const end = new Date();
 6       end.setTime(end.getTime());
 7       end.setHours(end.getHours());
 8       end.setMinutes(end.getMinutes());
 9       end.setSeconds(end.getSeconds());
10       const start = new Date();
11       start.setTime(start.getTime());
12       start.setHours(0);start.setMinutes(0);start.setSeconds(0);
13       picker.$emit('pick', [start, end]);
14     }
15   },
16   {
17     text: '昨天',
18     onClick(picker) {
19       const end = new Date();
20       end.setTime(end.getTime() - 3600 * 1000 * 24 * 1);
21       end.setHours(23);end.setMinutes(59);end.setSeconds(59);
22       const start = new Date();
23       start.setTime(start.getTime() - 3600 * 1000 * 24 * 1);
24       start.setHours(0);start.setMinutes(0);start.setSeconds(0);
25       picker.$emit('pick', [start, end]);
26     }
27   },
28   {
29     text: '最近一周',
30     onClick(picker) {
31       const end = new Date();
32       end.setHours(23);end.setMinutes(59);end.setSeconds(59);
33       const start = new Date();
34       start.setTime(start.getTime() - 3600 * 1000 * 24 * 6);
35       start.setHours(0);start.setMinutes(0);start.setSeconds(0);
36       picker.$emit('pick', [start, end]);
37     }
38   },
39   {
40     text: '最近30天',
41     onClick(picker) {
42       const end = new Date();
43       end.setHours(23);end.setMinutes(59);end.setSeconds(59);
44       const start = new Date();
45       start.setHours(0);start.setMinutes(0);start.setSeconds(0);
46       start.setTime(start.getTime() - 3600 * 1000 * 24 * 29);
47       picker.$emit('pick', [start, end]);
48     }
49   },
50   {
51     text: '最近90天',
52     onClick(picker) {
53       const end = new Date();
54       end.setHours(23);end.setMinutes(59);end.setSeconds(59);
55       const start = new Date();
56       start.setHours(0);start.setMinutes(0);start.setSeconds(0);
57       start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
58       picker.$emit('pick', [start, end]);
59     }
60   }]

3、在页面引入并调用

 import {pickerOptionsTimeEle} from 'utils/pageComAction';

// 在data处：
 data() {
      return {
         pickerOptions: {
             shortcuts: pickerOptionsTimeEle
        }
    }
}