element-ui/plus使用el-date-picker周 选择器返回时间范围处理案例

element-ui/plus使用el-date-picker周 选择器返回时间范围处理案例

如图所示
element-ui/plus使用el-date-picker周 选择器返回时间范围处理案例_第1张图片

 <el-date-picker
   @change="changeTime"
   :picker-options="{ firstDayOfWeek: 1 }"
   v-model="value1"
   type="week"
   format="YYYY年 第ww周"
   placeholder="Pick a week"
 />

// js

const startTimeStamp = ref('')
const endTimeStamp = ref('')
const timeFun = (unixtimestamp) => {
  const date = new Date(unixtimestamp)
  date.setDate(date.getDate() + 1) // 加一天
  const year = date.getFullYear()
  const month = ('0' + (date.getMonth() + 1)).slice(-2)
  const day = ('0' + date.getDate()).slice(-2)
  return `${year}-${month}-${day}`
}

const changeTime = (val) => {
  if (val) {
    let timeStamp = val.getTime()
    const oneDay = 24 * 60 * 60 * 1000
    startTimeStamp.value = timeFun(timeStamp - oneDay)
    endTimeStamp.value = timeFun(timeStamp + oneDay * 5)
    console.log(startTimeStamp.value, endTimeStamp.value)
  }
}

感谢阅读 一键三连 谢谢

你可能感兴趣的:(vue,elementui)