js筛选最近三天、七天、一个月、三个月、年份的数据

html部分的代码:
<el-popover
popper-class='popper_wrapper'
placement="bottom-start"
width="180"
trigger="click"
ref='popover4'
v-model= "popoverShow4">
<el-radio-group v-model="checkTime">
    <el-radio label="近七天"></el-radio>
    <el-radio label="近一个月"></el-radio>
    <el-radio label="近三个月"></el-radio>
    <el-radio :label='NowYear'></el-radio>
    <el-radio :label='LastYear'></el-radio>
    <el-radio :label='LastLastYear'></el-radio>
    <el-radio :label='threeYearAgo'></el-radio>
</el-radio-group>
<div class='footer_wrapper'>
       <div class='btn quxiao' @click='popoverShow4 = false'>取消</div>
       <div class='btn sure' @click='sureSelectTime'>确认</div>
   </div>
</el-popover>
//数据部分
getTableData () {
               var date = new Date;
               this.NowYear = date.getFullYear();
               this.LastYear = this.NowYear-1;
               this.LastLastYear = this.NowYear-2;
               this.threeYearAgo = (this.NowYear-3) + "年及以前";
}
// js部分
// 点击确定后
sureSelectTime () {
                this.popoverShow4 = false;
                // console.log(this.checkTime);
                if(this.checkTime == '近七天') {
                    this.fewDay(7);
                } else if (this.checkTime == '近一个月') {
                    this.fewDay(30);
                } else if (this.checkTime == '近三个月') {
                    this.fewDay(90);
                } else if (typeof(this.checkTime) == 'number') {
                    this.year = this.checkTime;
                    this.YearShow(this.year);
                } else {
                    this.year = this.threeYearAgo;
                    this.selectList = this.tableData.filter( (d) => {
                        return this.whichYearAgo(d.serveTime, this.year);
                    });
                    this.list = this.selectList.slice((this.currentPage - 1) * this.pageSize, (this.currentPage) * this.pageSize);
                    this.sumpage = this.selectList.length;
                }
            },
// 计算开始和结束的时间差
            mistiming (sDate1, sDate2, count) {
              let aDate, oDate1, oDate2, iDays;
              aDate = sDate1.split('-');
              aDate[2] = aDate[2].substr(0,2);//取出日期
              // console.log(aDate);
              oDate1 = new Date(aDate[1] + '-' + aDate[2] + '-' + aDate[0]);
              aDate = sDate2.split('-');
              oDate2 = new Date(aDate[1] + '-' + aDate[2] + '-' + aDate[0]);
              iDays = parseInt(Math.abs(oDate1 - oDate2) / 1000 / 60 / 60 / 24);
              if (iDays <= count) {
                 return sDate1;//如果小于传入的天数,筛选出数据中符合条件的数据
              }
            },
            // 对页面数据的筛选及渲染整合到一个函数中
            fewDay (count) {
                this.timeForMat();
                this.selectList = this.tableData.filter( (d) => {
                    return this.mistiming(d.serveTime, this.timer1, count);
                });
                // console.log(this.selectList,'selectList');
                this.list = this.selectList.slice((this.currentPage - 1) * this.pageSize, (this.currentPage) * this.pageSize);
                this.sumpage = this.selectList.length;
            },

            whichYear (sDate1, year) {
                let aDate, oDate1;
                aDate = sDate1.split('-');
                oDate1 = aDate[0];
                if (oDate1 == year) {
                   return oDate1;//筛选出固定年份的数据
                }
            },
            whichYearAgo(sDate1, year) {
                let aDate, oDate1;
                aDate = sDate1.split('-');
                oDate1 = aDate[0];
                if (oDate1 <= year) {
                   return oDate1;//筛选出3年前的数据
                }
            },
            // 对页面数据的筛选及渲染整合到一个函数中
            YearShow (year) {
                this.selectList = this.tableData.filter( (d) => {
                    return this.whichYear(d.serveTime, year);
                });
                // console.log(this.selectList,'selectList');
                this.list = this.selectList.slice((this.currentPage - 1) * this.pageSize, (this.currentPage) * this.pageSize);
                this.sumpage = this.selectList.length;
            },
           // 显示当前时间以及几年前的时间
            timeForMat () {
              // 拼接时间
              let time1 = new Date();
              time1.setTime(time1.getTime());
              let Y1 = time1.getFullYear();
              let M1 = ((time1.getMonth() + 1) > 10 ? (time1.getMonth() + 1) : '0' + (time1.getMonth() + 1));
              let D1 = (time1.getDate() > 10 ? time1.getDate() : '0' + time1.getDate());
              this.timer1 = Y1 + '-' + M1 + '-' + D1; // 当前时间
              // let time2 = new Date()
              // time2.setTime(time2.getTime() - (24 * 60 * 60 * 1000 * (count-1)))
              // let Y2 = time2.getFullYear()
              // let M2 = ((time2.getMonth() + 1) > 10 ? (time2.getMonth() + 1) : '0' + (time2.getMonth() + 1))
              // let D2 = (time2.getDate() > 10 ? time2.getDate() : '0' + time2.getDate())
              // this.timer2 = Y2 + '-' + M2 + '-' + D2 //七天或30天前的数据
            },

效果:
《js筛选最近三天、七天、一个月、三个月、年份的数据》

    原文作者:youlinaixu
    原文地址: https://blog.csdn.net/youlinaixu/article/details/82260455
    本文转自网络文章,转载此文章仅为分享知识,如有侵权,请联系博主进行删除。
点赞