2026.3.19

riku

2026-03-19 64d3eae2852d17c3bbade662d3f7a7c47d681ad6

 src/sfc/TimeSelect.vue

@@ -14,6 +14,57 @@
-->
<script>
import dayjs from 'dayjs'
// 时间范围快捷选项
const dayStart = dayjs('2023-08-01').startOf('date')
const dayEnd = dayStart.endOf('date')
const shortcuts = [
  {
    text: '今天',
    value: [dayStart.toDate(), dayEnd.toDate()],
  },
  {
    text: '本周',
    value: [dayStart.startOf('week').toDate(), dayEnd.endOf('week').toDate()],
  },
  {
    text: '上周',
    value: [dayStart.day(-7).toDate(), dayEnd.day(-1).toDate()],
  },
  {
    text: '本月',
    value: [dayStart.startOf('month').toDate(), dayEnd.endOf('month').toDate()],
  },
  {
    text: '上月',
    value: [
      dayStart.subtract(1, 'month').startOf('month').toDate(),
      dayEnd.subtract(1, 'month').endOf('month').toDate(),
    ],
  },
  {
    text: '本季度',
    value: [dayStart.startOf('quarter').toDate(), dayEnd.endOf('quarter').toDate()],
  },
  {
    text: '上季度',
    value: [
      dayStart.subtract(1, 'quarter').startOf('quarter').toDate(),
      dayEnd.subtract(1, 'quarter').endOf('quarter').toDate(),
    ],
  },
  {
    text: '去年',
    value: [
      dayStart.subtract(1, 'year').startOf('year').toDate(),
      dayEnd.subtract(1, 'year').endOf('year').toDate(),
    ],
  },
  {
    text: '今年',
    value: [dayStart.startOf('year').toDate(), dayEnd.endOf('year').toDate()],
  },
]

export default {
  emits: ['submitTime'],
  props: {
@@ -42,6 +93,8 @@
      ],
      // 选中的时间范围
      selectedRange: '',
      // 时间范围快捷选项
      shortcuts,
    }
  },

@@ -138,6 +191,7 @@
    <div v-show="showTimePicker" class="time-picker-container">
      <el-date-picker
        v-model="time"
        :shortcuts="shortcuts"
        type="daterange"
        range-separator="~"
        start-placeholder="开始时间"
@@ -153,6 +207,7 @@
    <span class="demonstration">时间：</span>
    <el-date-picker
      v-model="time"
      :shortcuts="shortcuts"
      type="daterange"
      range-separator="~"
      start-placeholder="Start date"