网站开发会用到定时器功能网站颜色 字体

网站开发会用到定时器功能,网站颜色 字体,网络营销实训总结报告,好123设为主页官网网址大全欢迎大家加入开源鸿蒙跨平台开发者社区#xff0c;一起共建开源鸿蒙跨平台生态。 浇水记录系统概述 浇水记录系统是植物养护应用的核心功能之一。它记录用户对植物的浇水操作#xff0c;帮助用户了解植物的浇水历史和规律。在Cordova框架与OpenHarmony系统的结合下#xff…欢迎大家加入开源鸿蒙跨平台开发者社区一起共建开源鸿蒙跨平台生态。浇水记录系统概述浇水记录系统是植物养护应用的核心功能之一。它记录用户对植物的浇水操作帮助用户了解植物的浇水历史和规律。在Cordova框架与OpenHarmony系统的结合下我们需要实现一个完整的浇水记录系统包括记录的创建、查询、统计和提醒功能。浇水记录数据模型classWateringRecord{constructor(plantId,amount,notes){this.idwater_Date.now();this.plantIdplantId;this.amountamount;// 毫升this.datenewDate();this.notesnotes;this.soilMoisturenull;// 土壤湿度百分比}}classWateringManager{constructor(){this.records[];this.loadFromStorage();}addWateringRecord(plantId,amount,notes){constrecordnewWateringRecord(plantId,amount,notes);this.records.push(record);this.saveToStorage();returnrecord;}getWateringRecordsForPlant(plantId){returnthis.records.filter(rr.plantIdplantId).sort((a,b)newDate(b.date)-newDate(a.date));}getLastWateringDate(plantId){constrecordsthis.getWateringRecordsForPlant(plantId);returnrecords.length0?records[0].date:null;}}这个浇水记录数据模型定义了WateringRecord类和WateringManager类。WateringRecord类包含浇水的详细信息包括植物ID、浇水量、日期和备注。WateringManager类管理所有浇水记录提供了添加记录和查询功能。与OpenHarmony传感器的集成functionrecordWateringWithSensorData(plantId,amount,notes){// 获取土壤湿度传感器数据cordova.exec(function(sensorData){console.log(传感器数据获取成功);constrecordnewWateringRecord(plantId,amount,notes);record.soilMoisturesensorData.moisture;wateringManager.records.push(record);wateringManager.saveToStorage();// 保存到数据库saveWateringRecordToDatabase(record);showToast(浇水记录已保存);},function(error){console.error(传感器数据获取失败:,error);// 即使传感器失败仍然保存记录constrecordwateringManager.addWateringRecord(plantId,amount,notes);saveWateringRecordToDatabase(record);},SensorPlugin,getSoilMoisture,[plantId]);}这段代码展示了如何与OpenHarmony的传感器服务集成。通过SensorPlugin我们可以获取土壤湿度等传感器数据并将其与浇水记录关联。这提供了更加准确的浇水数据。浇水记录列表展示functionrenderWateringRecords(plantId){constplantplants.find(pp.idplantId);if(!plant)return;constrecordswateringManager.getWateringRecordsForPlant(plantId);constcontainerdocument.getElementById(page-container);container.innerHTMLdiv classwatering-records-container h2${plant.name}的浇水记录/h2 button classadd-record-btn onclickshowAddWateringRecordDialog(${plantId}) ➕ 添加浇水记录 /button /div;if(records.length0){container.innerHTMLp classempty-message还没有浇水记录/p;return;}constrecordsListdocument.createElement(div);recordsList.classNamerecords-list;records.forEach(record{constrecordItemdocument.createElement(div);recordItem.classNamerecord-item;recordItem.innerHTMLdiv classrecord-info p classrecord-date${record.date.toLocaleString(zh-CN)}/p p classrecord-amount 浇水量:${record.amount}ml/p${record.soilMoisture?p classsoil-moisture土壤湿度:${record.soilMoisture}%/p:}${record.notes?p classrecord-notes备注:${record.notes}/p:}/div div classrecord-actions button onclickeditWateringRecord(${record.id})编辑/button button onclickdeleteWateringRecord(${record.id})删除/button /div;recordsList.appendChild(recordItem);});container.appendChild(recordsList);}这个函数负责渲染浇水记录列表。它显示了特定植物的所有浇水记录包括日期、浇水量、土壤湿度和备注。用户可以通过编辑和删除按钮管理记录。这种设计提供了清晰的记录展示。添加浇水记录对话框functionshowAddWateringRecordDialog(plantId){constdialogdocument.createElement(div);dialog.classNamemodal-dialog;dialog.innerHTMLdiv classmodal-content h3添加浇水记录/h3 form idadd-watering-form div classform-group label浇水量 (毫升)/label input typenumber idwatering-amount min0 required /div div classform-group label浇水日期/label input typedatetime-local idwatering-date required /div div classform-group label备注/label textarea idwatering-notes/textarea /div div classform-actions button typesubmit保存/button button typebutton onclickcloseDialog()取消/button /div /form /div;document.getElementById(modal-container).appendChild(dialog);// 设置默认日期为当前时间constnownewDate();document.getElementById(watering-date).valuenow.toISOString().slice(0,16);document.getElementById(add-watering-form).addEventListener(submit,function(e){e.preventDefault();constamountparseFloat(document.getElementById(watering-amount).value);constdatenewDate(document.getElementById(watering-date).value);constnotesdocument.getElementById(watering-notes).value;constrecordnewWateringRecord(plantId,amount,notes);record.datedate;wateringManager.records.push(record);wateringManager.saveToStorage();saveWateringRecordToDatabase(record);closeDialog();renderWateringRecords(plantId);showToast(浇水记录已添加);});}这个函数创建并显示添加浇水记录的对话框。用户可以输入浇水量、日期和备注。提交后新记录会被添加到wateringManager中并保存到数据库。这种设计提供了灵活的记录输入方式。浇水统计功能classWateringStatistics{constructor(wateringManager){this.wateringManagerwateringManager;}getTotalWateringCount(plantId){returnthis.wateringManager.getWateringRecordsForPlant(plantId).length;}getAverageWateringAmount(plantId){constrecordsthis.wateringManager.getWateringRecordsForPlant(plantId);if(records.length0)return0;consttotalrecords.reduce((sum,r)sumr.amount,0);returntotal/records.length;}getWateringFrequency(plantId,days30){constrecordsthis.wateringManager.getWateringRecordsForPlant(plantId);constcutoffDatenewDate();cutoffDate.setDate(cutoffDate.getDate()-days);constrecentRecordsrecords.filter(rnewDate(r.date)cutoffDate);return(recentRecords.length/days*7).toFixed(2);// 每周浇水次数}getWateringTrend(plantId,days30){constrecordsthis.wateringManager.getWateringRecordsForPlant(plantId);consttrend{};records.forEach(record{constdatenewDate(record.date).toLocaleDateString(zh-CN);trend[date](trend[date]||0)record.amount;});returntrend;}}这个WateringStatistics类提供了浇水的统计功能。getTotalWateringCount返回浇水总次数getAverageWateringAmount计算平均浇水量getWateringFrequency计算浇水频率getWateringTrend返回浇水趋势数据。这些统计信息可以帮助用户了解浇水规律。浇水提醒功能functioncheckWateringReminders(){plants.forEach(plant{constlastWateringDatewateringManager.getLastWateringDate(plant.id);constwateringIntervalplant.wateringInterval||7;// 默认7天if(!lastWateringDate){// 从未浇过水sendWateringReminder(plant.id,plant.name,从未浇过水);return;}constdaysSinceWateringMath.floor((newDate()-newDate(lastWateringDate))/(24*60*60*1000));if(daysSinceWateringwateringInterval){sendWateringReminder(plant.id,plant.name,已${daysSinceWatering}天未浇水);}});}functionsendWateringReminder(plantId,plantName,message){cordova.exec(function(result){console.log(提醒已发送);},function(error){console.error(提醒发送失败:,error);},NotificationPlugin,sendReminder,[{title:${plantName}需要浇水,message:message,plantId:plantId,type:watering}]);}// 定期检查浇水提醒setInterval(checkWateringReminders,60*60*1000);// 每小时检查一次这段代码实现了浇水提醒功能。checkWateringReminders函数检查所有植物如果某个植物超过设定的浇水间隔就发送提醒。通过NotificationPlugin我们可以向用户发送系统通知。这个功能帮助用户不会忘记给植物浇水。浇水记录导出functionexportWateringRecords(plantId){constplantplants.find(pp.idplantId);constrecordswateringManager.getWateringRecordsForPlant(plantId);constcsvContent[[日期,浇水量(ml),土壤湿度(%),备注],...records.map(r[r.date.toLocaleString(zh-CN),r.amount,r.soilMoisture||N/A,r.notes||])].map(rowrow.join(,)).join(\n);cordova.exec(function(result){console.log(浇水记录已导出);},function(error){console.error(导出失败:,error);},FilePlugin,exportData,[{filename:${plant.name}_watering_records.csv,content:csvContent}]);}这段代码实现了浇水记录的导出功能。通过FilePlugin我们可以将浇水记录导出为CSV格式的文件。这个功能允许用户备份和分析浇水数据。总结浇水记录系统是植物养护应用的重要功能。通过合理的数据模型设计、与OpenHarmony系统的集成和各种统计分析功能我们可以创建一个功能完整的浇水记录系统帮助用户科学地管理植物的浇水。