在 compare-form.vue 中添加 compareDate 隐藏字段,并在提交时自动填入当前时间

news/2025/2/26 19:07:27/

在 compare-form.vue 中添加 compareDate 隐藏字段,并在提交时自动填入当前时间。

  • 提交表单时存入的对象是FakeRegistration,这个对象里面有compareDate字段,刚好表格查询的对象也是FakeRegistration,所以表格展示的时间就是刚才提交的。
typescript:src/views/tools/fake-strategy/components/compare-form.vue
<template><el-dialog// ... 其他代码保持不变 ...><div class="ave-form-wrap"><div class="ave-form-box"><el-form>// ... 其他表单项保持不变 ...<!-- 添加隐藏的compareDate字段 --><input v-model="form.compareDate" type="hidden" /></el-form></div></div>// ... 其他代码保持不变 ...</el-dialog>
</template><script lang="ts">javascript">
// ... 其他 import 保持不变 ...export default class extends Vue {// ... 其他属性和方法保持不变 ...private handleSubmit() {// 在提交时自动填入当前时间const now = new Date()const year = now.getFullYear()const month = String(now.getMonth() + 1).padStart(2, '0')const day = String(now.getDate()).padStart(2, '0')const hours = String(now.getHours()).padStart(2, '0')const minutes = String(now.getMinutes()).padStart(2, '0')const seconds = String(now.getSeconds()).padStart(2, '0')this.form.compareDate = `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`this.save()}// ... 其他代码保持不变 ...
}
</script>

主要修改:

  1. 在表单中添加了隐藏的 compareDate 输入字段
  2. 在 handleSubmit 方法中,添加了自动生成当前时间的逻辑
  3. 生成的时间格式为 “YYYY-MM-DD HH:mm:ss”
  4. 在提交前将当前时间赋值给 form.compareDate

这样当用户点击提交按钮时,会自动将当前时间填入 compareDate 字段并发送给后端。

在这里插入图片描述


http://www.ppmy.cn/news/1575069.html

相关文章

显式指定 ChromeDriver 路径

‌1️⃣ 显式指定 ChromeDriver 路径‌ 在代码中直接传递驱动路径&#xff0c;绕过 Selenium Manager 的自动检测&#xff1a; pythonCopy Code from selenium import webdriver from selenium.webdriver.chrome.service import Service# 指定 ChromeDriver 绝对路径&#xf…

源码分享1:批量修改PDF文件名称

批量修改文件名称 运行效果解析 运行效果 执行后 36266郜一凡200304000038内部调拨 修改为 1234一二 200304000038 四个字的 解析 输入需要修改的文件目录 输入完成后 会将文件夹中的目录的 文件名 修改为 保留文件名中间部分 修改前缀和后缀 import os import re import t…

在线疫苗预约小程序(论文源码调试讲解)

第4章 系统设计 用户对着浏览器操作&#xff0c;肯定会出现某些不可预料的问题&#xff0c;但是不代表着系统对于用户在浏览器上的操作不进行处理&#xff0c;所以说&#xff0c;要提前考虑可能会出现的问题。 4.1 系统设计思想 系统设计&#xff0c;肯定要把设计的思想进行统…

微信小程序开发中CSS书写常见问题及最佳实践

在微信小程序中&#xff0c;存在一些CSS选择器的限制和特殊性。如后代选择器&#xff08;如 view button&#xff09;在微信小程序中可能无法按预期工作&#xff0c;我设置width改变按钮的默认宽度效&#xff0c;而更具体的选择器&#xff08;如 view button.btn&#xff09;则…

powershell:报错npm : 无法加载文件 D:\develop\nodejs\npm.ps1,因为在此系统上禁止运行脚本

问题 原因分析 由于 ​PowerShell 的执行策略&#xff08;Execution Policy&#xff09;​​ 限制导致的。Windows 系统默认禁止运行未签名的脚本&#xff08;包括 npm 脚本&#xff09;&#xff0c;因此运行 npm run dev 时&#xff0c;PowerShell 阻止了脚本的执行。 解决…

爬虫运行后如何保存数据?

爬虫运行后&#xff0c;将获取到的数据保存到本地或数据库中是常见的需求。Python 提供了多种方式来保存数据&#xff0c;包括保存为文本文件、CSV 文件、JSON 文件&#xff0c;甚至存储到数据库中。以下是几种常见的数据保存方法&#xff0c;以及对应的代码示例。 1. 保存为文…

一文掌握python中正则表达式的各种使用

文章目录 1. 正则表达式基础1.1 常用元字符1.2 基本用法 2. 正则表达式高级功能2.1 分组捕获2.2 命名分组2.3 非贪婪匹配2.4 零宽断言2.5 编译正则表达式2.6 转义字符 3. 常见应用场景3.1 验证邮箱格式3.2 提取 URL3.3 提取日期3.4 提取HTML中的链接3.5 提取HTML中的图片链接3.…

【Qt】可爱的窗口关闭确认弹窗实现

文章目录 ​​​实现思路界面构建交互逻辑实现颜色渐变处理圆形部件绘制 代码在主窗口的构造函数中创建弹窗实例ExitConfirmDialog 类代码ColorCircleWidget 类代码 今天在Qt实现了这样一个可互动的窗口&#xff08;上图由于录屏工具限制没有录制到鼠标&#xff09; ​​​实现…