当前位置: 首页 > article >正文

根据当前日期计算并选取上一个月和上一个季度的日期范围,用于日期控件的快捷选取功能

1.选择月份范围

代码如下:

   <el-date-picker v-model="value" type="monthrange" align="right" unlink-panels range-separator="至"start-placeholder="开始月份" end-placeholder="结束月份" :picker-options="pickerOptions"></el-date-picker>
 pickerOptions: {shortcuts: [{text: '本月',onClick(picker) {picker.$emit('pick', [new Date(), new Date()]);}}, {text: '上个月',onClick(picker) {const end = new Date();const start = new Date();start.setMonth(start.getMonth() - 1);picker.$emit('pick', [start, end]);}}, {text: '上季度',onClick(picker) {const end = new Date();const month = end.getMonth();let start = new Date();// 计算上一个季度的开始和结束日期if (month >= 0 && month <= 2) {  // 第一季度start.setFullYear(end.getFullYear() - 1, 9, 1);end.setFullYear(end.getFullYear() - 1, 11, 31);} else if (month >= 3 && month <= 5) {start.setFullYear(end.getFullYear(), 0, 1);end.setFullYear(end.getFullYear(), 2, 31);} else if (month >= 6 && month <= 8) {start.setFullYear(end.getFullYear(), 3, 1);end.setFullYear(end.getFullYear(), 5, 30);} else {  // 第四季度start.setFullYear(end.getFullYear(), 6, 1);end.setFullYear(end.getFullYear(), 8, 30);}picker.$emit('pick', [start, end]);}}]},value: ''

2.选择日期范围

代码如下:

        <el-date-picker v-model="value" type="daterange" align="right" unlink-panels range-separator="至"start-placeholder="开始日期" end-placeholder="结束日期" :picker-options="pickerOptions"></el-date-picker>
      pickerOptions: {shortcuts: [{text: '本月',onClick(picker) {picker.$emit('pick', [new Date(), new Date()]);}}, {text: '上个月',onClick(picker) {const end = new Date();const start = new Date();start.setMonth(start.getMonth() - 1);start.setDate(1); end.setMonth(end.getMonth() - 1);end.setMonth(end.getMonth() + 1, 0);picker.$emit('pick', [start, end]);}}, {text: '上季度',onClick(picker) {const end = new Date();const month = end.getMonth();let start = new Date();if (month >= 0 && month <= 2) {start.setFullYear(end.getFullYear() - 1, 9, 1);end.setFullYear(end.getFullYear() - 1, 11, 31);} else if (month >= 3 && month <= 5) {start.setFullYear(end.getFullYear(), 0, 1);end.setFullYear(end.getFullYear(), 2, 31);} else if (month >= 6 && month <= 8) {start.setFullYear(end.getFullYear(), 3, 1);end.setFullYear(end.getFullYear(), 5, 30);} else {start.setFullYear(end.getFullYear(), 6, 1);end.setFullYear(end.getFullYear(), 8, 30);}picker.$emit('pick', [start, end]);}}]},value: '',

http://www.lryc.cn/news/2383673.html

相关文章:

  • 【C++】set、map 容器的使用
  • 【MySQL】第1节|全面理解MySQL架构
  • YOLOv8模型剪枝笔记(DepGraph和Network Slimming网络瘦身)
  • App Builder技术选型指南:从AI编程到小程序容器,外卖App开发实战
  • TDengine 高可用——三副本
  • el-table高度自适应、数据查询后高度展示错误问题
  • 【蓝桥杯真题精讲】第 16 届 Python A 组(省赛)
  • Java接口设计:ECharts热力图的绘制
  • 深入理解 MongoDB 的 _id 和 ObjectId:从原理到实践
  • C++内存复制
  • 【notepad++如何设置成中文界面呢?】
  • 当AI遇上科研:北大“科学导航”重塑学术探索全流程
  • 大模型在闭合性胫骨平台骨折诊疗全流程中的应用研究报告
  • PHP学习笔记(八)
  • C#中WSDL文件引用问题
  • Ubuntu 22.04上升级Node.js版本
  • 养生新策:五维开启健康生活
  • 生成对抗网络(GAN)原理
  • 【SpringBoot实战指南】使用 Spring Cache
  • centos8 配置网桥,并禁止kvm默认网桥
  • C++:list容器,deque容器
  • 【Node.js】全栈开发实践
  • 自定义类型-联合体
  • Qt项目开发中所遇
  • ubuntu sh安装包的安装方式
  • Redis语法大全
  • OpenAI宣布:核心API支持MCP,助力智能体开发
  • 我的爬虫夜未眠:一场与IP限流的攻防战
  • git:The following paths are ignored by one of your
  • 算法--js--组合总和