vue element-ui 年月日时间筛选 选择范围年加一年，月加一个月 获取时间戳

遇到一个筛选时间范围的功能，选择类型不同范围都加一，选择天 结束天数加一天；选择月，结束月加一个月，选择年 年份结束时间为加一年的结束时间，时间范围控制在一年内筛选数据。记录一下，觉得有意思。

<template>
	<el-form size="small" inline label-width="90px">
		<el-form-item label="时间类型">
          <el-select v-model="dateType"
            filterable @change="onChangeDateType"
            placeholder="请输入时间类型"
            class="selWidth"
          >
            <el-option
              v-for="item in dateTypeList"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            />
          </el-select>
        </el-form-item>

        <el-form-item label="时间" class="mr10" >
          <div class="yy-pro-time">
            <el-date-picker
              v-model="yearTimeValue"
              :type="dateType" :key="dateType"
              unlink-panels
              :format="dateType|onFormatFilters"
              value-format="timestamp"
              range-separator="至"
              start-placeholder="开始日期"
              end-placeholder="结束日期"
              @change="onchangeTime"
            />
          </div>
          <!-- :picker-options="pickerOptions" -->
        </el-form-item>
	</el-form>
</template>
<script>
	import utils from "@/utils/index";
	export default {
		filters: {
    		onFormatFilters(value) {
		      if (value=='daterange') {
		        return 'yyyy-MM-dd'
		      } else if (value=='monthrange') {
		        return 'yyyy-MM'
		      } else {
		        return 'yyyy'
		      }
		    }
	  	}
	  	data() {
	  		returen {
	  			yearTimeValue: '',
	  			dateType: 'daterange',
				dateTypeList: [
			        { value: 'daterange', label: "日" },
			        { value: 'monthrange', label: "月" },
			        { value: 'year', label: "年" },
			   ],
			}
	  	},
	  	methods: {
			// 具体日期
		   onchangeTime(e) {
		      if (e) {
		        if (this.dateType=='daterange') {
		          let day = 24*60*60*1000
		          this.tableFrom.startTime = e[0]/1000;
		          this.tableFrom.endTime = (e[1]+day)/1000;
		        } else if (this.dateType=='monthrange') {
		          this.tableFrom.startTime = e[0]/1000;
		          this.tableFrom.endTime = utils.monthDateAddOne(e[1]);
		        } else {
		          this.tableFrom.startTime = e/1000;
		          this.tableFrom.endTime = utils.yearDateAddOne(e);
		        }
		      } else {
		        this.tableFrom.startTime = "";
		        this.tableFrom.endTime = "";
		      }
		    },
		    onChangeDateType(e) {
		      this.yearTimeValue = ''
		    },
		}
	}
</script>

utils.js 文件中

/**
 * 获取年份时间戳加一年 秒
 * @param {*} e 年份时间戳
 * 
 */
 export function yearDateAddOne (e) {
  let date = new Date(e)
  let year1 = date.getFullYear() + 1
  let day = year1+'-01-01 00:00:00'
  let endTime = new Date(day).getTime()
  return endTime/1000
}
/**
 * 获取月份时间戳加一月 秒
 * @param {*} e 年份时间戳
 * 
 */
 export function monthDateAddOne (e) {
  let date = new Date(e)
  let year1 = date.getFullYear()
  let month = date.getMonth()+2
  if (month<10) {
    month = '-0'+month
  } else if (month<=12) {
    month = '-'+month
  } else {
    month = '-0'+1
    year1 = year1 + 1
  }
  let day = year1+month+'-01 00:00:00'
  let endTime = new Date(day).getTime()
  return endTime/1000
}
export default { yearDateAddOne,monthDateAddOne}