el-date-picker快捷选择

el-date-picker快捷选择

<el-date-picker
    v-model="form.dateStateEnd"
    type="daterange"
    :picker-options="pickerOptions"
    unlink-panels
    value-format="yyyy-MM-dd"
    range-separator="至"
    start-placeholder="注册开始日期"
    end-placeholder="注册结束日期"
    >
</el-date-picker>

data() {
    return {
    pickerOptions: {
        shortcuts: [
          {
            text: "今天",
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              picker.$emit("pick", [start, end]);
            },
          },
          {
            text: "昨天",
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              end.setTime(start.getTime() - 3600 * 1000 * 24);
              start.setTime(start.getTime() - 3600 * 1000 * 24);
              picker.$emit("pick", [start, end]);
            },
          },
          {
            text: "过去7天",
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
              picker.$emit("pick", [start, end]);
            },
          },
          {
            text: "过去30天",
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
              picker.$emit("pick", [start, end]);
            },
          },
          {
            text: "本周",
            onClick(picker) {
              const now = new Date();
              var nowYear = now.getYear();
              const end = new Date();
              nowYear += nowYear < 2000 ? 1900 : 0;
              const start = new Date(
                nowYear,
                now.getMonth(),
                now.getDate() - now.getDay() + 1
              );
              picker.$emit("pick", [start, end]);
            },
          },
          {
            text: "本月",
            onClick(picker) {
              const now = new Date();
              var nowYear = now.getYear();
              const end = new Date();
              nowYear += nowYear < 2000 ? 1900 : 0;
              const start = new Date(nowYear, now.getMonth(), 1);
              picker.$emit("pick", [start, end]);
            },
          },
          {
            text: "上月",
            onClick(picker) {
              var nowDate = new Date();
              var year = nowDate.getFullYear();
              var month = nowDate.getMonth();
              if (month == 0) {
                month = 12;
                year = year - 1;
              }
              var lastDay = new Date(year, month, 0);
              const start = new Date(year + "-" + month + "-" + 1);
              const end = new Date(
                year + "-" + month + "-" + lastDay.getDate()
              );
              picker.$emit("pick", [start, end]);
            },
          },
        ],
      },
    }
    }