Skip to content

Repository files navigation

Time is Money | 窝囊费计算器

Web app Live demo

上班为了下班,摸鱼为了快乐。把看不见的时间,变成看得见的快乐数字。

在线体验:https://timeismoney888.lovable.app/app.html

最近更新

当前发布版本:v1.0.1

最新版本在保留中英双语与跨天累计逻辑的基础上,补充了最新页面交互:

  • 中文标题风格同步更新为 摸鱼量化终端
  • 收益卡片新增“上浮类比反馈”动画,金额变化更有即时感
  • README 与项目元信息已同步到当前线上版本

这是什么?

Time is Money 中英介绍图

Time is Money 是一个轻松有趣的“窝囊费 / 摸鱼收益”计算器。

你只需要输入年收入、工作天数、每天工时、上班时间和统计起点,它就会实时帮你计算:

  • 本次摸鱼已经赚了多少
  • 今天到现在已经赚了多少
  • 从指定日期开始累计赚了多少
  • 你的秒薪、分薪、时薪、日薪大概是多少

它不是严肃的财务工具,更像是一个打工人的快乐仪表盘:让每一秒等待下班的时间,都变成一点点正在上涨的小安慰。

它能做什么?

  • 实时滚动金额:数字会像计价器一样持续跳动,越看越有动力。
  • 三张核心卡片:本次收益、今日战绩、累计财富,一眼看懂你的“时间回报”。
  • 生活化换算:把金额换成烤肠、咖啡、电影票、旅行、手机、游艇等轻松好懂的类比。
  • 里程碑动效:赚到不同阶段,会触发金币、气泡、彩带、鲜花、烟花、飞机、火箭等庆祝动画。
  • 隐私模式:一键把金额遮住,适合在办公室低调使用。
  • 分享按钮:看到好笑的结果,可以复制链接发给朋友。
  • 打赏彩蛋:开心的话,可以顺手请作者喝杯咖啡。

怎么使用?

  1. 输入你的年收入。
  2. 选择工作制:双休、单休,或者硬核 007。
  3. 填写每天工作几小时、几点上班。
  4. 选择从哪一天开始统计。
  5. 点击 启动量化,然后看数字开始快乐上涨。

小贴士:把页面挂在后台,一会儿回来看看,可能会有惊喜。

适合谁?

  • 想给工作日加一点轻松感的人
  • 喜欢把抽象时间变成具体数字的人
  • 想做一个好玩网页小项目的人
  • 想研究前端动画、实时计算、玻璃拟态界面的人

技术栈

这个项目使用了现代前端技术构建:

  • React
  • TanStack Router / TanStack Start
  • Vite
  • TypeScript
  • Tailwind CSS
  • Cloudflare 相关配置

同时,核心页面也保留了一个可以直接阅读的 app.html,里面包含了主要界面、动画和计算逻辑。

免责声明

本项目主要用于娱乐和学习,请勿拿着计算结果找老板兑现。
如果数字让你开心了,说明它已经完成了自己的使命。


Time is Money

Work is for getting off work. Taking a tiny break is for staying human.

Live Demo: https://timeismoney888.lovable.app/app.html

Latest update

Current release: v1.0.1

The latest version keeps the bilingual UI and cross-day accumulation logic, while syncing the newest page interaction updates:

  • The Chinese title style is now aligned as 摸鱼量化终端
  • Earning cards now show a floating comparison animation when the mapped item changes
  • README and project metadata have been refreshed to match the current online version

What is this?

Time is Money is a playful salary-time calculator for working people.

Enter your annual income, work schedule, daily hours, start time, and tracking date. The page will turn your working time into a live, moving number so you can see how much value your time is creating second by second.

It is not a serious finance app. It is more like a tiny comfort dashboard for everyday work: open it, start it, and watch your time quietly become something visible.

What can it do?

  • Live money counter: numbers keep rolling in real time.
  • Three simple views: current session, today, and total accumulated value.
  • Friendly comparisons: converts money into things like snacks, coffee, movie tickets, trips, phones, and even yachts.
  • Milestone celebrations: coins, bubbles, confetti, flowers, fireworks, planes, and rockets appear as your number grows.
  • Privacy mode: hide the money numbers with one click.
  • Share button: copy the link and send it to friends.
  • Donation easter egg: a lighthearted coffee button for people who had fun.

How to use it

  1. Enter your annual income.
  2. Choose your weekly work schedule.
  3. Fill in your daily work hours and start time.
  4. Pick the date you want to start tracking from.
  5. Click Start, then watch the number grow.

Tip: leave it running in the background and come back later. The dashboard may surprise you.

Who is it for?

  • People who want a lighter way to survive the workday
  • People who enjoy turning abstract time into visible numbers
  • Beginners looking for a fun frontend project to read and remix
  • Developers interested in small UI animations, live calculations, and glass-style dashboards

Tech stack

Built with:

  • React
  • TanStack Router / TanStack Start
  • Vite
  • TypeScript
  • Tailwind CSS
  • Cloudflare-oriented config

The main experience is also easy to inspect in app.html, where the interface, animations, and calculation logic live together.

Disclaimer

This project is for fun and learning. Please do not ask your boss to cash out the number on the screen.
If it makes your workday a little more cheerful, it has done its job.

About

Time is Money|打工人的窝囊费计算器 / bilingual salary-slacking calculator

Topics

Resources

Stars

2 stars

Watchers

0 watching

Forks

Releases

Packages

Contributors

Languages