You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 
 
 

105 lines
3.8 KiB

<!DOCTYPE html>
<html lang="zh_CN" >
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link rel="shortcut icon" href="img/favicon.ico" type="image/x-icon">
<title>番茄钟</title>
<link rel="stylesheet" href="css/index.css">
</head>
<body>
<script src="js/NoSleep.min.js"></script>
<script src="js/jquery-3.6.0.min.js"></script>
<script src="js/echarts.min.js"></script>
<script src="js/tools.js"></script>
<script src="js/index.js"></script>
<!-- 版心 -->
<div class="w">
<!-- 帮助界面 -->
<div class="class page p0 ">
<h3>提示(点击进入主页)</h3>
<div class="tip">
<p>点击屏幕中间进入/退出全屏</p>
<p>点击左上角的番茄钟获取提示</p>
<p>点击中上角的时间电量切换钟表模式</p>
<p>点击右上角的已工作时间切换显示计划时间</p>
</div>
</div>
<!-- 第一页:主界面 -->
<div class="page p1 none">
<div class="top flex">
<!-- 顶部状态栏 -->
<div class="top-left iconfont">&#xe602;番茄钟</div>
<div class="top-center"><span class="now-time">00:00:00</span></div>
<div class="top-right">好好学习,天天向上</div>
</div>
<div class="main flex ">
<!-- 主要的时钟部分 -->
<div class="lcd" id="n1">4</div>
<div class="lcd" id="n2">5</div>
<div class="lcd" id="n3">:</div>
<div class="lcd" id="n4">0</div>
<div class="lcd" id="n5">0</div>
</div>
<div class="footer flex">
<!-- 底部 -->
<div class="footer-left play iconfont">&#xe769;</div>
<div class="footer-center reset iconfont">&#xe60a;</div>
<div class="footer-right setting iconfont">&#xe631;</div>
</div>
</div>
<!-- 第二页:设置界面 -->
<div class="page p2 none">
<ol>
<li class="option">设置工作/休息时间</li>
<li class="option">设置计划倒计时</li>
<li class="option">查看工作历史</li>
<li class="option">清除本地数据</li>
<li class="option">返回</li>
</ol>
</div>
<!-- 第三页:设置工作/休息时间 -->
<div class="page p3 none">
<div class="p3-main">
<div class="line1">
<span>工作时间(分):</span>
<span><input type="text" name="study-time" id="input-study-time" value="45"></span>
</div>
<div class="line2">
<span>休息时间(分):</span>
<span ><input type="text" name="rest-time" id="input-rest-time" value="5"></span>
</div>
</div>
<div class="p3-bottom">
<button>应用</button>
<button>返回</button>
</div>
</div>
<!-- 第四页:设置计划倒计时 -->
<div class="page p4 none">
<div class="p4-main">
<div class="line1">
<span>计划名称:</span>
<span><input type="text" name="plan-name" id="input-plan-name" value=""></span>
</div>
<div class="line2">
<span>截止日期:</span>
<span ><input type="text" name="plan-time" id="input-plan-time" value="2021/12/31"></span>
</div>
</div>
<div class="p4-bottom">
<button>应用</button>
<button>返回</button>
</div>
</div>
<!-- 第五页:展示历史工作时间 -->
<div class="page p5 none ">
<div id="echarts" style="width:85vw;height: 50vw; margin: 0 auto;">
</div>
</div>
</div>
</body>
</html>