花札物语收获时节积分计算/title> <style> *{margin:0;padding:0;box-sizing:border-box;} body{ font-family: "Microsoft Yahei",sans-serif; background: #FFF9EF; /* 活动页面浅米色背*/ padding:40px 15px; } .container{ max-width:520px; margin:0 auto; background:#fffef9; /* 超浅暖白卡片 */ border-radius:20px; box-shadow:0 6px 20px rgba(250, 190, 150, 0.15); overflow:hidden; border: 1px solid #f9d6a6; } .back-btn{ position: fixed; top: 20px; left: 20px; background: rgba(255,255,255,0.9); padding: 10px 20px; border-radius: 12px; text-decoration: none; color: #E678A3; font-weight: 600; box-shadow: 0 2px 10px rgba(0,0,0,0.1); } .back-btn:hover{ background: #fff; } .head{ background: linear-gradient(90deg, #E678A3, #d16392); /* 活动粉色标题 */ color:#fff; text-align:center; padding:22px 0 12px 0; font-size:20px; font-weight:600; } .head-desc{ background: linear-gradient(90deg, #E678A3, #d16392); color:#fff; text-align:center; font-size:12px; padding-bottom:18px; opacity:0.92; } .content{ padding:25px 30px; background: #fffef9; } .item{ margin-bottom:20px; } .label{ display:block; font-size:15px; color:#5a4b42; /* 活动文字*/ margin-bottom:8px; } input,select{ width:100%; height:44px; padding:0 14px; border:1px solid #f9d6a6; border-radius:12px; font-size:15px; transition:0.3s; outline:none; background: #fff; color: #5a4b42; } input:focus,select:focus{ border-color: #E678A3; box-shadow:0 0 0 3px rgba(230, 120, 163, 0.15); } .btn{ width:100%; height:46px; border:none; border-radius:12px; background: linear-gradient(90deg, #F9D069, #f7c150); /* 活动按钮黄色 */ color:#5a3d2d; font-size:16px; font-weight:bold; cursor:pointer; transition:0.3s; margin-top:5px; } .btn:hover{ opacity:0.94; } .result-box{ margin-top:25px; padding:20px; background: #fff5e6; border-radius:12px; border-left:4px solid #E678A3; line-height:1.9; font-size:14.5px; color:#5a4b42; } .red-text{ color: #e54982 !important; /* 活动主题红粉*/ font-weight:bold; } .green-text{ color: #8CC779 !important; /* 活动清新*/ font-weight:bold; } hr { border: none; border-top: 1px dashed #f9d6a6; margin: 10px 0; } </style> </head> <body> <a href="index.html" class="back-btn">返回花札物语二级页面</a> <div class="container"> <div class="head">2026.05.14-05.27<br>花札物语收获时节活动计算/div> <div class="head-desc">仅作参考使用如有错误可联作者@望秋微信公会ID45 山月随人归/div> <div class="content"> <div class="item"> <label class="label">累计总积?br>不是当前花币</label> <input type="number" id="nowScore" placeholder="输入现有积分" oninput="countData()" min="0"> </div> <div class="item"> <label class="label">每日捐赠选择</label> <select id="chooseFlower"> <option value="0">不捐赠任何花/option> <option value="27360">盈粉香豌/option> <option value="25920" selected>甜蜜红苹果树</option> <option value="24480">沐白\浅金风雨/option> </select> </div> <button class="btn" onclick="countData()">立即计算</button> <div class="result-box" id="resText"> 自动识别活动日期<br> 活动起始5?4日第一天<br> 输入积分即可一键算出所需水滴 </div> </div> </div> <script> // 基础固定数据 const startDay = new Date(2026,4,14); const allDay = 14; const targetScore = 800000; const ratio = 0.01; // 自动计算天数 function getDayNum(){ let now = new Date(); let diff = Math.floor((now - startDay) / (1000*60*60*24)); let pass = diff + 1; // 第几天比如diff=2 天 // 边界处理最少第1天最多第14? pass = pass < 1 1 : pass; pass = pass > allDay allDay : pass; let leave = allDay - pass; // 核心修正剩余天总天已过天数 return {pass,leave}; } function countData(){ let score = Number(document.getElementById('nowScore').value) || 0; let flowerAdd = Number(document.getElementById('chooseFlower').value); let dayData = getDayNum(); let passDay = dayData.pass; let leaveDay = dayData.leave; let needAllScore = Math.max(0,targetScore - score); let needAllWater = needAllScore * ratio; let dayWaterNo = leaveDay>0 needAllWater/leaveDay : 0; let flowerWater = flowerAdd * ratio; let canGetScore = leaveDay * flowerAdd; let realNeedScore = Math.max(0,targetScore - score - canGetScore); let realNeedWater = realNeedScore * ratio; let dayNeedWater = leaveDay>0 realNeedWater/leaveDay : 0; let allDayWater = Number(dayNeedWater) + flowerWater; let dailyAvgScore = Math.ceil(targetScore / allDay); let todayTargetScore = dailyAvgScore * passDay; let isOnTrack = score >= todayTargetScore; let deficitWater = Math.ceil((todayTargetScore - score) * ratio); let html = ` 活动进度第${passDay}天剩余${leaveDay}?br> 目标总积分${targetScore.toLocaleString()}<br> 当前已有积分{score.toLocaleString()}<hr> <span class="red-text">无每日捐花情/span><br> 还需总积分${needAllScore.toLocaleString()}<br> 总共需消耗水滴${Math.ceil(needAllWater)}<br> 日均需消耗水滴<span class="red-text">${Math.ceil(dayWaterNo)}</span><hr> <span class="green-text">开启每日捐/span><br> 每日捐花抵扣积分{Math.round(flowerWater * 100)}<br> 抵扣后还需水滴{Math.ceil(realNeedWater)}<br> 往后日均额外消耗水滴<span class="red-text">${Math.ceil(dayNeedWater)}</span><hr> 每日平均目标分数{dailyAvgScore}<br> 今日应达积分数${todayTargetScore}<br> ${!isOnTrack `<span class="red-text">未达每日平均分数</span><br>还需额外消耗水滴<span class="red-text">${deficitWater}</span>` : `<span class="green-text">已达每日平均分数</span>`}<br> `; document.getElementById('resText').innerHTML = html; } </script> <div style="text-align:center;margin-top:25px;"> <a href="index.html" style="display:inline-block;padding:12px 30px;background:linear-gradient(90deg,#E678A3,#d16392);color:#fff;text-decoration:none;border-radius:12px;font-weight:600;"> 返回花札物语二级页面 </a> </div> <script src="footer.js"></script> </body> </html>