二话不说,先上图

实现如上代码:

           //获取本周第一天
showWeekFirstDay: function () {
let Nowdate = new Date();
let WeekFirstDay = new Date(Nowdate - (Nowdate.getDay() - 1) * 86400000);
let M = Number(WeekFirstDay.getMonth()) + 1;
if (M < 10) {
M = "0" + M;
}
let D = WeekFirstDay.getDate();
if (D < 10) {
D = "0" + D;
}
return WeekFirstDay.getFullYear() + "-" + M + "-" + D;
},
// 自动回填日期
autoTime(type) {
this.active_time_type = type;
switch (type) {
case 1:
              //今日
var temp_start_create_time = new Date().Format("yyyy-MM-dd");
var temp_end_create_time = new Date().Format("yyyy-MM-dd");
break;
case 2:
              //本周
var temp_start_create_time = this.showWeekFirstDay()
var temp_end_create_time = new Date().Format("yyyy-MM-dd");
break;
case 3:
              //本月
var temp_start_create_time = util.getCurrentMonthFirst();
var temp_end_create_time = util.getCurrentMonthLast();
break;
default:
break;
}
this.value1 = []//element-ui 使用的日期控件定义的v-model值
this.value1.push(temp_start_create_time, temp_end_create_time)
this.start_create_time = this.value1[0];
this.end_create_time = this.value1[1]; }
}

Vue实现点击时间获取时间段查询功能的更多相关文章

  1. C#根据当前时间获取周,月,季度,年度等时间段的起止时间

    最近有个统计分布的需求,需要按统计本周,上周,本月,上月,本季度,上季度,本年度,上年度等时间统计分布趋势,所以这里就涉及到计算周,月,季度,年度等的起止时间了,下面总结一下C#中关于根据当前时间获取 ...

  2. Calendar时间获取天,周,月,季度,年度时间段

    Date类 Date类的大多数构造函数和方法都已经抛弃,只留下和毫秒有关的操作,目前常用的构造函数 常用方法 设置毫秒数 读取毫秒数 toString()打印结果 //创建日期对象,把当前的毫秒值转成 ...

  3. vue 的点击事件怎么获取当前点击的元素

    手机赚钱怎么赚,给大家推荐一个手机赚钱APP汇总平台:手指乐(http://www.szhile.com/),辛苦搬砖之余用闲余时间动动手指,就可以日赚数百元   首先 vue的点击事件 是用 @cl ...

  4. bootstrap-table前端实现多条件时间段查询数据

    实现思路:通过正则匹配到字段是否符合条件,时间段转换为时间戳比对. 这是大体的效果图: 页面的html代码 <div class="content-head mgb10"&g ...

  5. jeecg 扩展封装查询条件 时间段查询

    使用jeecg框架开发的小伙伴们知道,添加查询条件,通常是我们加一个配置(query="true")就可以将该字段设置为查询条件.简单方便.但是这样的配置查询条件仅适用于输入框输入 ...

  6. Springboot+Vue实现仿百度搜索自动提示框匹配查询功能

    案例功能效果图 前端初始页面 输入搜索信息页面 点击查询结果页面 环境介绍 前端:vue 后端:springboot jdk:1.8及以上 数据库:mysql 核心代码介绍 TypeCtrler .j ...

  7. day80:luffy:短信sdk接入&点击获取验证码&注册功能的实现&Celery实现短信发送功能

    目录 1.短信sdk接入 2.前端点击获取验证码效果 3.注册后端接口实现 4.注册-前端 5.Celery 6.Celery完成短信发送功能 1.短信sdk接入 1.准备工作 1.下载云通讯相关的文 ...

  8. 基于SqlSugar的开发框架循序渐进介绍(20)-- 在基于UniApp+Vue的移动端实现多条件查询的处理

    在做一些常规应用的时候,我们往往需要确定条件的内容,以便在后台进行区分的进行精确查询,在移动端,由于受限于屏幕界面的情况,一般会对多个指定的条件进行模糊的搜索,而这个搜索的处理,也是和前者强类型的条件 ...

  9. 【RL-TCPnet网络教程】第30章 RL-TCPnet之SNTP网络时间获取

    第30章      RL-TCPnet之SNTP网络时间获取 本章节为大家讲解RL-TCPnet的SNTP应用,学习本章节前,务必要优先学习第29章的NTP基础知识.有了这些基础知识之后,再搞本章节会 ...

随机推荐

  1. php类知识点滴---类继承的一些原则

    完全重写 <?php class coach { public function __construct() { echo "欢迎来到~北武堂训练~"; } }     cl ...

  2. sql——limit

    PageHelper: https://blog.csdn.net/baidu_38083619/article/details/82463058 Sql执行顺序: https://blog.csdn ...

  3. IDEA运行有问题debug正常解决方案

    朋友们!有没有遇到这样的问题,IDEA运行有问题,debug确是正常的,不经怀疑人生! 不要慌!点击maven,clean一下,再compile一下,就好啦! 不要慌!点击maven,clean一下, ...

  4. yii ActiveRecord

    在活动记录里自定义属性(数据表里没有的属性), 起初没有注意到问题. 在这个继承了activeRecord的模型中, 还自定义了很多方法,  此为前提.  出现的问题是: 使用属性获取不到数据库的字段 ...

  5. Prism框架的Module(模块化)编程

    Prism框架用的是新版本的,Prism7.1.关于其中的变动,感兴趣的参考https://www.cnblogs.com/hicolin/p/8694892.html 如何告诉Shell(我们的宿主 ...

  6. vue模板语法上集

    模板语法上集 1.1 插值 1.1.1 文本 {{msg}} 1.1.2 html 使用v-html指令用于输出html代码 1.1.3 属性 HTML属性中的值应使用v-bind指令 1.1.4 表 ...

  7. Shell操作

    Shell 1. 我们无法直接和内核打交道,Shell就是用来解释命令,用来和内核打交道用的. 2. Shell有不同形式(同样命令在不同shell中不一定通用):cshell.bash.kshell ...

  8. [POJ1151][HDU1542]Atlantis(线段树,扫描线)

    英文题面,我就只放个传送门了. Solution  题意是算矩形面积并,这是扫描线算法能解决的经典问题. 算法的大致思想是,把每一个矩形拆成上边和下边(以下称作扫描线),每条扫描线有四个参数l,r,h ...

  9. dpkg -l 命令返回数值

    ubuntu命令: dpkg -l 每条记录对应一个软件包,每条记录的第一,二,三个字符是软件包的状态标识,后边依此时软件包名称,版本号,和简述:   第一个字符为,期望值:包括如下状态: u 状态未 ...

  10. Button.OnClientClick

    Button.OnClientClick Gets or sets the client-side script that executes when a Button control's Click ...