Vue实现点击时间获取时间段查询功能
二话不说,先上图
实现如上代码:
//获取本周第一天
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实现点击时间获取时间段查询功能的更多相关文章
- C#根据当前时间获取周,月,季度,年度等时间段的起止时间
最近有个统计分布的需求,需要按统计本周,上周,本月,上月,本季度,上季度,本年度,上年度等时间统计分布趋势,所以这里就涉及到计算周,月,季度,年度等的起止时间了,下面总结一下C#中关于根据当前时间获取 ...
- Calendar时间获取天,周,月,季度,年度时间段
Date类 Date类的大多数构造函数和方法都已经抛弃,只留下和毫秒有关的操作,目前常用的构造函数 常用方法 设置毫秒数 读取毫秒数 toString()打印结果 //创建日期对象,把当前的毫秒值转成 ...
- vue 的点击事件怎么获取当前点击的元素
手机赚钱怎么赚,给大家推荐一个手机赚钱APP汇总平台:手指乐(http://www.szhile.com/),辛苦搬砖之余用闲余时间动动手指,就可以日赚数百元 首先 vue的点击事件 是用 @cl ...
- bootstrap-table前端实现多条件时间段查询数据
实现思路:通过正则匹配到字段是否符合条件,时间段转换为时间戳比对. 这是大体的效果图: 页面的html代码 <div class="content-head mgb10"&g ...
- jeecg 扩展封装查询条件 时间段查询
使用jeecg框架开发的小伙伴们知道,添加查询条件,通常是我们加一个配置(query="true")就可以将该字段设置为查询条件.简单方便.但是这样的配置查询条件仅适用于输入框输入 ...
- Springboot+Vue实现仿百度搜索自动提示框匹配查询功能
案例功能效果图 前端初始页面 输入搜索信息页面 点击查询结果页面 环境介绍 前端:vue 后端:springboot jdk:1.8及以上 数据库:mysql 核心代码介绍 TypeCtrler .j ...
- day80:luffy:短信sdk接入&点击获取验证码&注册功能的实现&Celery实现短信发送功能
目录 1.短信sdk接入 2.前端点击获取验证码效果 3.注册后端接口实现 4.注册-前端 5.Celery 6.Celery完成短信发送功能 1.短信sdk接入 1.准备工作 1.下载云通讯相关的文 ...
- 基于SqlSugar的开发框架循序渐进介绍(20)-- 在基于UniApp+Vue的移动端实现多条件查询的处理
在做一些常规应用的时候,我们往往需要确定条件的内容,以便在后台进行区分的进行精确查询,在移动端,由于受限于屏幕界面的情况,一般会对多个指定的条件进行模糊的搜索,而这个搜索的处理,也是和前者强类型的条件 ...
- 【RL-TCPnet网络教程】第30章 RL-TCPnet之SNTP网络时间获取
第30章 RL-TCPnet之SNTP网络时间获取 本章节为大家讲解RL-TCPnet的SNTP应用,学习本章节前,务必要优先学习第29章的NTP基础知识.有了这些基础知识之后,再搞本章节会 ...
随机推荐
- mysql增删查改练习
建表 班级表 create table class( cid int auto_increment unique, caption varchar(32) not null default '' )c ...
- 不使用C库函数(Sprintf)将void* 指针转换为十六进制字符串
#include <stdio.h> #include <stdint.h> #include <stdlib.h> void hexDump(void *ptr, ...
- 报表开发神器!DevExpress Reporting v19.1全平台新功能解析
行业领先的.NET界面控件DevExpress Reporting全新发布了v19.1版本,本文主要为大家介绍.NET Reporting v19.1中发布的所有平台的新功能,欢迎下载v19.1试用, ...
- JavaScript16进制颜色值和rgb的转换
//十六进制颜色值域RGB格式颜色值之间的相互转换//十六进制颜色值的正则表达式 var reg = /^#([0-9a-fA-f]{3}|[0-9a-fA-f]{6})$/; /*RGB颜色转换为1 ...
- VMware 虚拟机下载与安装
虚拟机下载 VMware官网地址:https://www.vmware.com/ 进行官网后,点击左边的下载图标,然后 根据操作系统选择合适的产品,在这里以Windows系统为例,点击转至下载,如下图 ...
- 题解 【POJ1187】 陨石的秘密
解析 考虑到数据范围,其实我们可以用记搜. 设\(f[a][b][c][d]\)表示还剩\(a\)个'{}',\(b\)个"[]",\(c\)个"()",深度\ ...
- 题解 【NOIP2014】解方程
题面 解析 这题的数据看起来似乎特别吓人... 但实际上, 这题非常好想. 只需要模一个大质数就行了(我模的是1e9+7)(实测有效) 另外,a要用快读读入,再一边模Mod(因为实在太大了). 然后, ...
- java mybaits 调用存储过程
@Override public BaseResultMessage saveOrderConfirm(String billNo) { BaseResultMessage rm = Utils.re ...
- vueCli和脚手架
vue CLI相当于一个基于vue开发的框架:可以用来快速开发vue项目: 1.安装 由于需要用到npm命令,所以要先安装node.js: node.js下载地址:https://node ...
- Jmeter(十二)常用插件
一.下载及安装 下载地址:https://jmeter-plugins.org/install/Install/ 下载后文件为一个jar包,将其放入jmeter安装目录下的lib/ext目录,然后重启 ...