ant-design-vue开始时间和结束时间的正则校验

news2024/11/24 3:33:01

在这里插入图片描述

        <a-row>
                      <a-col :span="12">
                        <a-form-model-item label="开始日期" :label-col="{span:8}" :wrapper-col="{span:14}" prop="tzgg0112">
                          <template v-if="!readOnly">
                            <a-date-picker  @change="onChangeStartDate">
                              <a-icon slot="suffixIcon" type="calendar" />
                            </a-date-picker>
                          </template>
                          <span v-else>{{ formInfo.tzgg0112}}</span>
                        </a-form-model-item>
                      </a-col>
                      <a-col :span="12">
                        <a-form-model-item label="结束日期" :label-col="{span:6}" :wrapper-col="{span:14}" prop="tzgg0113">
                          <template v-if="!readOnly">
                            <a-date-picker @change="onChangEndDate">
                              <a-icon slot="suffixIcon" type="calendar" />
                            </a-date-picker>
                          </template>
                          <span v-else>{{ formInfo.tzgg0112}}</span>
                        </a-form-model-item>
                      </a-col>
                    </a-row>
 data () {
   const validateStartTime = (rule, value, callback) => {
      const startTime = value
      const endTime = this.formInfo.tzgg0113
      if (!value) return callback(new Error('采集开始时间不能为空'))
      if (!endTime) callback()
      if (startTime && endTime) {
        const startDate = new Date(startTime)
        const endDate = new Date(endTime)
        if (startDate > endDate) {
          return callback(new Error('采集开始时间不能晚于采集结束时间'))
        }
      }
      callback()
    }

    const validateEndTime = (rule, value, callback) => {
      const startTime = this.formInfo.tzgg0112
      const endTime = value
      if (!value) return callback(new Error('采集结束时间不能为空'))
      if (!startTime) callback()
      if (startTime && endTime) {
        const startDate = new Date(startTime)
        const endDate = new Date(endTime)
        if (endDate < startDate) {
          return callback(new Error('采集结束时间不能早于采集开始时间'))
        }
      }
      callback()
    }
 rules: {
		  ...
        tzgg0112: [{
          validator: validateStartTime,
          required: true,
          trigger: ['change', 'blur']

        }],
        tzgg0113: [{
          validator: validateEndTime,
          required: true,
          trigger: ['change', 'blur']
        }]

      },

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/796284.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

如何运用R语言进行Meta分析与【文献计量分析、贝叶斯、机器学习等】多技术融合实践与拓展

Meta分析是针对某一科研问题&#xff0c;根据明确的搜索策略、选择筛选文献标准、采用严格的评价方法&#xff0c;对来源不同的研究成果进行收集、合并及定量统计分析的方法&#xff0c;最早出现于“循证医学”&#xff0c;现已广泛应用于农林生态&#xff0c;资源环境等方面。…

QT JSON数据格式讲解

文章目录 前言一、JSON是什么二、JSON在线解析三、QT中的JSON类四、构建JSON字符串五、解析JSON数据六.核心类QJsonDocument 类详解总结 前言 本篇文章开始带大家学习一下什么是JSON&#xff0c;并且学习QT当中的JSON使用。 一、JSON是什么 JSON&#xff08;JavaScript Obje…

【Vioovi】如何实现企业精益生产,探索精益生产的工具与方法

说起精益生产&#xff0c;相信很多朋友都会率先想到丰田&#xff0c;作为精益生产的鼻祖&#xff0c;精益生产一词最早便是由丰田传出的&#xff0c;是由其独特的生产方式衍生而来的一种现代管理哲学。如今&#xff0c;众多的知名企业以及知名院校都对其投入了大量的研究&#…

【C#】并行编程实战:并行编程中的模式

本章将介绍并行编程模式&#xff0c;重点是理解并行代码问题场景并使用并行编程/异步技术解决他们。本章会介绍几种最重要的编程模式。 本教程学习工程&#xff1a;魔术师Dix / HandsOnParallelProgramming GitCode 1、MapReduce 模式 引入 MapReduce 是为了解决处理大数据的问…

2023年大厂秋季校招整理

&#x1f430;首先声明这篇文章主要整理的是音视频领域的 下面这些是联想的校园招聘 视频编解码 所属部门&#xff1a;IDG 工作地点&#xff1a;北京 岗位职责 1.视频编解码的算法研究&#xff1b; 2.编解码系统的架构设计与实现&#xff1b; 3.视频编解码算法优化工作。 任…

ArrayList扩容原理,源码追踪(jdk8)

ArrayList 扩容原理 add方法&#xff08;扩容机制jdk8&#xff09; 写一个代码案例断点调试 package list;import java.util.ArrayList;/*** author 兰舟千帆* version 1.0* date 2023/7/26 19:08* Description 功能描述:案例断点查看ArrayList的源码(添加)*/ public class Ar…

西门子PLC仿真环境搭建及通信过程详解

随着工控及上位机的广泛应用&#xff0c;在学习过程中&#xff0c;很多时候&#xff0c;我们都需要软件和硬件的结合。本方案主要用于解决在学习过程中PLC硬件的需求&#xff0c;以西门子PLC为例&#xff0c;详细描述了基于TIA博途系列软件实现西门子PLC仿真环境的搭建过程&…

SpringBoot基础篇-在IDEA中隐藏文件或文件夹(超详细版)

正常创建一个SpringBoot项目有如下文件&#xff1a; 通常我们创建一个springboot项目时会自动生成一些暂时用不到的文件&#xff0c;稍许有些碍眼&#xff0c;对于喜爱项目结构整洁清晰的人更是十分别扭&#xff0c;但那些文件可能后面又会用到&#xff0c;所以这里给一个小技巧…

微信小程序 Page页面

新建页面只需要在app.json配置好路径&#xff0c;编译器自动新增了页面 项目首页&#xff0c;在app.json哪个页面是第一位&#xff0c;哪个页面就是小程序首页

C# OpenCvSharpe 二值化工具 阈值 自适应阈值 局部阈值 InRange

效果 阈值 自适应阈值 局部阈值 InRange 项目 VS2010.net4.0OpenCvSharper3 Demo下载

创建自己的docker python容器环境;支持新增python包并更新容器;离线打包、加载image

1、创建自己的docker python容器环境 参考&#xff1a;https://blog.csdn.net/weixin_42357472/article/details/118991485 首先写Dockfile&#xff0c;注意不要有txt等后缀 Dockfile # 使用 Python 3.9 镜像作为基础 FROM python:3.9# 设置工作目录 WORKDIR /app# 复制当前…

SAP创建会计凭证,用BAPI扩展字段方法:BAPI_ACC_DOCUMENT_POST

业务需求&#xff1a;和银行做一个接口&#xff0c;要通过银行流水产生会计凭证&#xff0c;会计凭证的事务码是F-02&#xff0c;查到了BAPI方法BAPI_ACC_DOCUMENT_POST。昨天测试发现&#xff0c;有一些参数在BAPI_ACC_DOCUMENT_POST的输入和表参数中根本没有&#xff0c;如记…

css实现步骤条中的横线

实现步骤中的横线&#xff0c;我们使用css中的after选择器&#xff0c;content写空&#xff0c;然后给这个范围设定一个绝对定位&#xff0c;相当于和它设置伪类选择的元素的位置&#xff0c;直接看代码&#xff1a; const commonStyle useMemo(() > ({fontSize: 30px}),[]…

【HCIA】14.WLAN基础与配置实现

WLAN的术语 基本服务集BSS 一个AP覆盖的范围在一个BSS相同的区域内&#xff0c;STA可以相互通信 基本服务集标识符BSSID 是无线网络的一个身份标识&#xff0c;用AP的MAC地址表示 服务集标识符SSID 无线网络的标识&#xff0c;用字符串表示 扩展服务集ESS 由多个使用相同的…

遥感数字图像处理实验教程(韦玉春)--部分实验问题回答

个人的学习思考&#xff0c;仅供参考。 目录 实验三、图像合成和显示增强 一、目的 二、要求 三、实验 实验五、图像变换 一、目的 二、要求 三、实验 实验六、图像滤波 一、目的 二、要求 三、实验 实验七、图像分割 一、目的 二、要求 三、实验 实验八、图…

【JavaScript】花点时间了解执行上下文

引言 当我们在浏览器中运行JavaScript代码时&#xff0c;浏览器会先创建一个全局执行上下文&#xff08;Global Execution Context&#xff09;&#xff0c;然后逐行解析和执行代码。 执行上下文是JavaScript中非常重要的概念&#xff0c;它决定了代码的执行顺序和作用域链等…

vue elemenet

日常开发当中&#xff0c;只使用vue是不够的&#xff0c;虽然提供给我们强大的功能&#xff0c;用的还是原生的html标签。 这可能就需要我们去关注前台美化展示的工作。 日常开发当中都是vue去配合前端的组件库&#xff0c;两个结合起来一起去开发。 知识点 Element Plus 介绍…

Qt应用开发(基础篇)——Button按钮

目录 一、前言 二&#xff1a;QAbstractButton 抽象按钮基类 三&#xff1a;QPushButton 普通按钮 四&#xff1a;QCommandLinkButton 链接按钮 五&#xff1a;QCheckBox 复选按钮 六&#xff1a;QRadioButton 单选按钮 七&#xff1a;QToolButton 工具按钮 一、前言 常…

一劳永逸的日报月报制作方法,还不快来get

许多政府机构、企业都会使用日报、月报来把握现有状况&#xff0c;比如说生产制造企业&#xff0c;需要通过日报来监控项目进度和生产数据。哪怕这些报表制作起来繁琐浪费、重复复杂&#xff0c;但是企业不得不通过日报对生产数据进行实时把控。 那么有没有一种办法或者工具&a…

Linux为何是软件开发专业人员的心头爱-Robotics Ubuntu

Linux与Windows都是十分常见的电脑操作系统&#xff0c;相信你对它们二者都有所了解&#xff01;在你的使用过程中&#xff0c;是否有什么事让你觉得在Linux上顺理成章&#xff0c;换到Windows上就令你费解&#xff1f;亦或者关于这二者你有任何想要分享的&#xff0c;都可以在…