chenhaodong / mew-iview

  <template>

      <row>

          <i-col span="12">

              <Date-picker type="datetime" :options="options1" placeholder="选择日期" style="width: 200px"></Date-picker>

          </i-col>

          <i-col span="12">

              <Date-picker type="datetimerange" :options="options2" placement="bottom-end" placeholder="选择日期" style="width: 200px"></Date-picker>

          </i-col>

      </row>

  </template>
  <script>
      export default {

          data () {
              return {

                  options1: {
                      shortcuts: [
                          {
                              text: '今天',
                              value () {
                                  return new Date();
                              },
                              onClick: (picker) => {
                                  this.$Message.info('点击了今天');
                              }
                          },
                          {
                              text: '昨天',
                              value () {
                                  const date = new Date();
                                  date.setTime(date.getTime() - 3600 * 1000 * 24);
                                  return date;
                              },
                              onClick: (picker) => {
                                  this.$Message.info('点击了昨天');
                              }
                          },
                          {
                              text: '一周前',
                              value () {
                                  const date = new Date();
                                  date.setTime(date.getTime() - 3600 * 1000 * 24 * 7);
                                  return date;
                              },
                              onClick: (picker) => {
                                  this.$Message.info('点击了一周前');
                              }
                          }
                      ]
                  },
                  options2: {
                      shortcuts: [
                          {
                              text: '最近一周',
                              value () {
                                  const end = new Date();
                                  const start = new Date();
                                  start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
                                  return [start, end];
                              }
                          },
                          {
                              text: '最近一个月',
                              value () {
                                  const end = new Date();
                                  const start = new Date();
                                  start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
                                  return [start, end];
                              }
                          },
                          {
                              text: '最近三个月',
                              value () {
                                  const end = new Date();
                                  const start = new Date();
                                  start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
                                  return [start, end];
                              }
                          }
                      ]
                  }

              }
          }

      }

  </script>