向银行家应用程序添加日期

● 首先我们将下面图片上的时间更换成现在的时间
在这里插入图片描述

const now = new Date();
const day = now.getDate();
const month = now.getMonth() + 1;
const year = now.getFullYear();
const hour = now.getHours();
const min = now.getMinutes();labelDate.textContent = `${day}/${month}/${year}, ${hour}:${min}`;

在这里插入图片描述

● 但是一般情况下,我们更喜欢能看到04/05这样的表达方式

const now = new Date();
const day = `${now.getDate()}`.padStart(2, 0);
const month = `${now.getMonth() + 1}`.padStart(2, 0);
const year = now.getFullYear();
const hour = `${now.getHours()}`.padStart(2, 0);
const min = `${now.getMinutes()}`.padStart(2, 0);labelDate.textContent = `${day}/${month}/${year}, ${hour}:${min}`;

在这里插入图片描述

注:padStart后面有两个参数,第一个参数就是必须为几位数,不够的用第二个参数补齐;

存取款时间

在这里插入图片描述

 movs.forEach(function (mov, i) {const type = mov > 0 ? 'deposit' : 'withdrawal';const date = new Date(acc.movementsDates[i]);const day = `${date.getDate()}`.padStart(2, 0);const month = `${date.getMonth() + 1}`.padStart(2, 0);const year = date.getFullYear();const displayDate = `${day}/${month}/${year}`;const html = `<div class="movements__row"><div class="movements__type movements__type--${type}">${i + 1} ${type}</div><div class="movements__date">${displayDate}</div><div class="movements__value">${mov.toFixed(2)}€</div></div>`;containerMovements.insertAdjacentHTML('afterbegin', html);});
};
//
这段代码是一个循环,用于遍历movs数组中的每个元素,并根据元素的正负值确定交易类型(存款或取款)。然后,它创建一个表示交易日期的Date对象,并使用该对象来获取日期、月份和年份,并格式化为“dd/mm/yyyy”的形式。接下来,它根据交易类型、日期和交易金额,生成HTML代码,并将其插入到指定的容器元素中。

● 但是我们在申请贷款的时候会发现,时间并没有进行更新
在这里插入图片描述

这是因为我们的数组中仅仅定义了八个时间,当增加了一个我们无法读取到
在这里插入图片描述

● 很简单,我们只需要在每次转账或者贷款的时候添加一下此时的时间就可以了

//转账
if (amount > 0 &&receiverAcc &&currentAccount.balance >= amount &&receiverAcc?.username !== currentAccount.username) {// Doing the transfercurrentAccount.movements.push(-amount);receiverAcc.movements.push(amount);currentAccount.movementsDates.push(new Date().toISOString());receiverAcc.movementsDates.push(new Date().toISOString());// Update UIupdateUI(currentAccount);}
});
//贷款
btnLoan.addEventListener('click', function (e) {e.preventDefault();const amount = Math.floor(inputLoanAmount.value);if (amount > 0 && currentAccount.movements.some(mov => mov >= amount * 0.1)) {// Add movementcurrentAccount.movements.push(amount);currentAccount.movementsDates.push(new Date().toISOString());// Update UIupdateUI(currentAccount);}inputLoanAmount.value = '';
});

在这里插入图片描述

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

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

相关文章

parallelsdesktop19密钥激活 PD19虚拟机完整图文安装教程

Parallels Desktop 19 &#xff08;简称 PD 19)是最新发布的 macOS 平台的 windows 虚拟机&#xff0c;本文是使用 Parallels Desktop 19 虚拟机安装 Windows 的详细图文破解安装教程。 一下载安装 Parallels Desktop 软件下载完成后打开&#xff0c;双击打开 安装.dmg Para…

3. 深度学习笔记--优化函数

深度学习——优化器算法Optimizer详解&#xff08;BGD、SGD、MBGD、Momentum、Adagrad、Adadelta、RMSprop、Adam、Nadam、AdaMax、AdamW &#xff09; 0. GD &#xff08;梯度下降&#xff09; Gradient Descent&#xff08;梯度下降&#xff09;是一种迭代优化算法&#xf…

汇昌联信电商:拼多多新手怎么做店铺的免费流量会慢慢起来?

在拼多多上开店&#xff0c;新手们往往面临着如何吸引免费流量的挑战。毕竟&#xff0c;流量是店铺生存和发展的血脉&#xff0c;没有流量&#xff0c;就没有销量&#xff0c;店铺也就失去了生命力。那么&#xff0c;作为拼多多新手&#xff0c;如何做才能让店铺的免费流量慢慢…

初识C语言——第十九天

for循环 1.简单概述 2.执行流程 3.建议事项&#xff1a;

RuoYi-Vue-Plus (SpringCache、CacheManager、@Cacheable、缓存雪崩、击穿、穿透)

一、概述 1、SpringCache是Spring提供的一个缓存框架&#xff0c;在Spring3.1版本开始支持将缓存添加到现有的spring应用程序中&#xff0c;在4.1开始&#xff0c;缓存已支持JSR-107注释和更多自定义的选项。 2、SpringCache利用了AOP&#xff0c;实现了基于注解的缓存功能&…

基于Java的qq截图工具参考论文(论文 + 源码)

【免费】基于Java的qq截图工具.zip资源-CSDN文库https://download.csdn.net/download/JW_559/89304179 基于Java的qq截图工具 摘要 当今时代是飞速发展的信息时代&#xff0c;人们在对信息的处理中对图像的处理量与日俱增&#xff0c;这一点在文档人员上显得非常突出。 本软…

Linux下Telemac-Mascaret源码编译安装及使用

目录 软件介绍 基本依赖 其它可选依赖 一、源码下载 二、解压缩 三、编译安装 3.1 修改环境变量设置文件 3.2 修改配置文件 3.3 编译安装 四、算例运行 软件介绍 TELEMAC-MASCARET是法国电力集团(EDF)的法国国立水利与环境实验室开发的一款研究水动力学和水文学领域的…

宿舍管理系统代码详解(登录界面)

之前已经对这个管理系统进行了大体上的结构的展现&#xff0c;后面的篇章将对其中的前端代码进行详细的介绍与展示。 目录 一、数据库建表 二、登录界面前端代码 1.样式展示 2.代码详解 &#xff08;1&#xff09;template部分 &#xff08;2&#xff09;script部…

DC/DC 隔离定电,压输入电源(0.1-3W)介绍

定电压输入非稳压输出 SMD(0.25-2W)系列&#xff0c;典型性能:直流输入、直流输出隔离型模块电源SMD 表贴型产品&#xff0c;完全实现采用全自动贴片机来组装和满足回流焊工艺&#xff0c;大大提高产能和人工费用。此产品小&#xff0c;效率高&#xff0c;低输出纹波及提供 300…

SSH 免密登录,设置好仍然需要密码登录解决方法

说明&#xff1a; ssh秘钥登录设置好了&#xff0c;但是登录的时候依然需要提供密码 查看系统安全日志&#xff0c;定位问题 sudo cat /var/log/auth.log或者 sudo cat /var/log/secure找到下面的信息 Authentication refused: bad ownership or modes...&#xff08;网上的…

重大升级 | OpenSCA SaaS全面接入供应链安全情报!

结合社区用户反馈及研发小伙伴的积极探索&#xff0c; OpenSCA 项目组再次发力&#xff0c;SaaS版本重大升级啦&#xff01; 用户的需求是OpenSCA前进的动力&#xff0c;欢迎更多感兴趣的朋友们积极试用和反馈~ 更 新 内 容 1.全面接入云脉XSBOM供应链安全情报 2.强大的资产…

嫦娥六号揭秘真相:阿波罗登月是真是假?一文终结所有疑问!

近期&#xff0c;嫦娥六号的成功发射如同璀璨的星辰&#xff0c;再次将人们的视线聚焦于浩瀚的宇宙&#xff0c;与此同时&#xff0c;网络上关于美国阿波罗登月是否造假的争议也如潮水般涌现。一些声音宣称&#xff0c;嫦娥六号的发射为揭示美国阿波罗登月任务的真实性提供了关…

宝塔面板各种疑难杂症处理命令教程

下载地址&#xff1a;宝塔面板各种疑难杂症处理命令教程 这份宝塔面板各种疑难杂症处理命令教程&#xff0c;可以解决市面上遇到的各种难题&#xff0c;建议有技术能行的下载使用&#xff0c;小白也可以下载来学习可以帮助你解决宝塔面板遇到的各种难题

对中介者模式的理解

目录 一、场景1、题目 【[来源](https://kamacoder.com/problempage.php?pid1094)】1.1 题目描述1.2 输入描述1.3 输出描述1.4 输入示例1.5 输出示例 二、不采用中介者设计模式1 代码2 问题 三、中介者设计模式1 代码2 更好的例子 四、个人思考 一、场景 设计模式不是银弹&am…

宝塔纯净版 7.6.0版本无需手机登录 [稳定版本/推荐]

下载地址&#xff1a;宝塔纯净版 7.6.0版本无需手机登录.zip 宝塔纯净版介绍 无需手机登录&#xff1a;不再有手机登录提示&#xff0c;或按照提示输入任意手机号密码即可模拟绑定&#xff1b; 安全&#xff1a;剥离了所有与宝塔官方的通信、上报、下发&#xff1b;并且不与…

有哪些网络兼职适合大学生参与?揭秘几个简单又实用的兼职机会

有哪些网络兼职适合大学生参与&#xff1f;揭秘几个简单又实用的兼职机会 对于大学生而言&#xff0c;除了专注于学业&#xff0c;利用空余时间参与一些网络兼职&#xff0c;不仅能锻炼个人技能&#xff0c;还能为未来的职业生涯积累宝贵的经验。想象一下&#xff0c;步入社会…

Linux-磁盘管理类实训

一、Linux分区和磁盘操作命令 &#xff08;1&#xff09;将系统内所有的分区&#xff08;文件系统&#xff09;列出来&#xff09; &#xff08;2&#xff09;将系统中所有特殊文件格式及名称都列出来 &#xff08;3&#xff09;将/bin下面的可以用的磁盘容量以易读的容量格式…

房屋出租管理系统需求分析及功能介绍

房屋租赁管理系统适用于写字楼、办公楼、厂区、园区、商城、公寓等商办商业不动产的租赁管理及租赁营销&#xff1b;提供资产管理&#xff0c;合同管理&#xff0c;租赁管理&#xff0c; 物业管理&#xff0c;门禁管理等一体化的运营管理平台&#xff0c;提高项目方管理运营效率…

OpenAI之Whisper实时语音分析转文字

1.安装ffmpeg 2.安装python3.11 3.安装whisper pip install whisper conda环境安装whisper conda install whisper 命令行安装openai-whisper pip install openai-whisper 设置环境变量 4.分析语音并输出(默认使用GPU计算&#xff0c;如果没有安装CUDA,请使用CPU) whisper …

吃透前端文件上传与文件相关操作

最近在学文件上传的操作,所以想把学习到东西写成一文章 这片文章是我以小白视角 慢慢学习并熟悉前端文件相关操作的流程总结出来的 前端文件上传 我首先想到是 <input type"file">选择文件</input>如果我们想限制上传文件的格式,大小或进行裁剪分片上传…