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,
    }
  },

@@ -61,8 +114,10 @@
  methods: {
    initOneWeekAgoTime() {
      // 给时间选择器设置默认时间为一周前
      this.time[0] = dayjs().subtract(4, 'week').format('YYYY-MM-DD HH:mm:ss')
      this.time[1] = dayjs().format('YYYY-MM-DD HH:mm:ss')
      // this.time[0] = dayjs().subtract(4, 'week').format('YYYY-MM-DD HH:mm:ss')
      // this.time[1] = dayjs().format('YYYY-MM-DD HH:mm:ss')
      // 2026.3.13 demo 中固定初始时间
      this.time = ['2023-08-01 00:00:00', '2023-08-31 23:59:59']
    },

    // 快捷时段选择
@@ -136,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="开始时间"
@@ -151,6 +207,7 @@
    <span class="demonstration">时间：</span>
    <el-date-picker
      v-model="time"
      :shortcuts="shortcuts"
      type="daterange"
      range-separator="~"
      start-placeholder="Start date"