健康管理模块 - Cordova与OpenHarmony混合开发实战
·
欢迎大家加入开源鸿蒙跨平台开发者社区，一起共建开源鸿蒙跨平台生态。
📌 概述
健康管理模块用于记录和追踪宠物的健康信息，包括体重、体温、医疗记录等。这个模块提供了完整的健康数据管理功能，支持健康指标的趋势分析和异常预警。通过Cordova框架，我们能够在Web层实现灵活的数据展示和分析，同时利用OpenHarmony的传感器能力获取实时的健康数据。
健康管理模块采用了时间序列数据展示，用户可以查看宠物健康指标随时间的变化趋势。同时提供了健康预警功能，当宠物的健康指标异常时，应用会自动提醒用户。
🔗 完整流程
健康数据记录流程：用户可以手动输入宠物的健康数据，如体重、体温、血压等。应用会将这些数据保存到数据库，并记录记录时间。用户也可以通过OpenHarmony的传感器自动获取宠物的体温和心率等数据。
健康数据分析流程：应用定期分析宠物的健康数据，计算各项指标的平均值、变化趋势等。如果发现异常，应用会生成预警信息。用户可以查看健康报告，了解宠物的整体健康状况。
医疗记录管理流程：用户可以记录宠物的医疗事件，如就医、用药、手术等。应用会将这些记录与健康数据关联，帮助用户追踪宠物的医疗历史。
🔧 Web代码实现
// 加载健康记录
async function loadHealthRecords(petId, limit = 50) {
try {
const records = await db.getHealthRecords(petId, limit);
return records.sort((a, b) => new Date(b.date) - new Date(a.date));
} catch (error) {
console.error('加载健康记录失败:', error);
return [];
}
}
// 添加健康记录
async function addHealthRecord(petId, recordData) {
try {
const record = {
petId: petId,
type: recordData.type,
value: recordData.value,
unit: recordData.unit,
date: recordData.date,
notes: recordData.notes,
createdAt: new Date()
};
await db.addHealthRecord(record);
showSuccess('健康记录已添加');
renderPetHealth();
} catch (error) {
showError('添加健康记录失败: ' + error.message);
}
}
这两个函数处理健康记录的加载和添加。加载函数按日期倒序排列记录。添加函数将新的健康数据保存到数据库。
// 渲染健康管理页面
async function renderPetHealth() {
const records = await loadHealthRecords(currentPetId);
const html = `
<div class="health-container">
<div class="health-header">
<h1>健康管理</h1>
<button class="btn-primary" onclick="showAddHealthModal()">添加记录</button>
</div>
<div class="health-stats">
<div class="stat-card">
<h3>最近体重</h3>
<p class="stat-value">${getLatestValue(records, 'weight')} kg</p>
</div>
<div class="stat-card">
<h3>最近体温</h3>
<p class="stat-value">${getLatestValue(records, 'temperature')} °C</p>
</div>
<div class="stat-card">
<h3>健康状态</h3>
<p class="stat-value ${getHealthStatus(records)}">${getHealthStatusText(records)}</p>
</div>
</div>
<div class="health-chart">
<h2>体重趋势</h2>
<canvas id="weight-chart"></canvas>
</div>
<div class="health-records">
<h2>健康记录</h2>
<div class="records-list">
${records.length > 0 ? records.map(record => `
<div class="record-item">
<div class="record-header">
<h4>${record.type}</h4>
<span class="record-date">${formatDate(record.date)}</span>
</div>
<div class="record-content">
<p class="record-value">${record.value} ${record.unit}</p>
${record.notes ? `<p class="record-notes">${record.notes}</p>` : ''}
</div>
<button class="btn-small btn-danger" onclick="deleteHealthRecord(${record.id})">删除</button>
</div>
`).join('') : '<p class="empty-state">还没有健康记录</p>'}
</div>
</div>
</div>
`;
document.getElementById('page-container').innerHTML = html;
drawWeightChart(records);
}
// 获取最新的健康指标值
function getLatestValue(records, type) {
const record = records.find(r => r.type === type);
return record ? record.value : '--';
}
// 获取健康状态
function getHealthStatus(records) {
const recentRecords = records.slice(0, 10);
const hasAbnormal = recentRecords.some(r => isAbnormalValue(r));
return hasAbnormal ? 'abnormal' : 'normal';
}
这个渲染函数生成了健康管理界面。显示最近的健康指标、趋势图表和详细的健康记录列表。
// 绘制体重趋势图
function drawWeightChart(records) {
const weightRecords = records.filter(r => r.type === 'weight').slice(0, 30);
const ctx = document.getElementById('weight-chart').getContext('2d');
new Chart(ctx, {
type: 'line',
data: {
labels: weightRecords.map(r => formatDate(r.date)),
datasets: [{
label: '体重 (kg)',
data: weightRecords.map(r => r.value),
borderColor: '#409EFF',
backgroundColor: 'rgba(64, 158, 255, 0.1)',
tension: 0.4
}]
},
options: {
responsive: true,
plugins: {
legend: { display: true }
},
scales: {
y: { beginAtZero: false }
}
}
});
}
绘制图表函数使用Chart.js库生成体重趋势图，帮助用户直观地了解宠物体重的变化。
🔌 原生代码实现
// HealthPlugin.ets - 健康管理原生插件
import { sensor } from '@kit.SensorServiceKit';
@Entry
@Component
struct HealthPlugin {
// 获取体温传感器数据
getTemperatureData(callback: (temperature: string) => void): void {
try {
sensor.on(sensor.SensorId.AMBIENT_TEMPERATURE, (data) => {
const temperature = data.data[0];
callback(temperature.toString());
});
} catch (error) {
console.error('[HealthPlugin] 获取体温失败:', error);
callback('');
}
}
// 获取心率传感器数据
getHeartRateData(callback: (heartRate: string) => void): void {
try {
sensor.on(sensor.SensorId.HEART_RATE, (data) => {
const heartRate = data.data[0];
callback(heartRate.toString());
});
} catch (error) {
console.error('[HealthPlugin] 获取心率失败:', error);
callback('');
}
}
// 生成健康报告
generateHealthReport(petId: string, healthData: string, callback: (reportPath: string) => void): void {
try {
const data = JSON.parse(healthData);
const report = `
宠物健康报告
============
宠物ID: ${petId}
生成时间: ${new Date().toISOString()}
最近体重: ${data.latestWeight} kg
平均体温: ${data.avgTemperature} °C
健康状态: ${data.status}
建议: ${data.recommendations}
`;
const reportPath = `/data/reports/health_${petId}_${Date.now()}.txt`;
const file = fileIo.openSync(reportPath, fileIo.OpenMode.CREATE | fileIo.OpenMode.WRITE);
fileIo.writeSync(file.fd, report);
fileIo.closeSync(file.fd);
callback(reportPath);
} catch (error) {
console.error('[HealthPlugin] 生成报告失败:', error);
callback('');
}
}
build() {
Column() {
Web({ src: 'resource://rawfile/www/index.html', controller: new WebviewController() })
}
}
}
这个原生插件提供了传感器数据获取和报告生成功能。通过sensor模块，我们能够获取宠物的体温和心率等实时数据。
Web-Native通信代码
// 获取体温数据
function getNativeTemperature() {
return new Promise((resolve, reject) => {
cordova.exec(
(temperature) => {
if (temperature) {
resolve(parseFloat(temperature));
} else {
reject(new Error('获取失败'));
}
},
(error) => {
console.error('获取体温失败:', error);
reject(error);
},
'HealthPlugin',
'getTemperatureData',
[]
);
});
}
// 生成健康报告
function generateNativeHealthReport(petId, healthData) {
return new Promise((resolve, reject) => {
cordova.exec(
(reportPath) => {
if (reportPath) {
showSuccess(`报告已生成: ${reportPath}`);
resolve(reportPath);
} else {
reject(new Error('生成失败'));
}
},
(error) => {
console.error('生成失败:', error);
reject(error);
},
'HealthPlugin',
'generateHealthReport',
[petId, JSON.stringify(healthData)]
);
});
}
这段代码展示了如何通过Cordova调用原生的传感器和报告生成功能。通过Promise包装，我们能够以异步的方式获取健康数据。
📝 总结
健康管理模块展示了Cordova与OpenHarmony在传感器集成和数据分析方面的应用。在Web层，我们实现了灵活的健康数据展示和趋势分析。在原生层，我们提供了传感器数据获取和报告生成等功能。
通过自动记录和分析健康数据，用户可以更好地了解宠物的健康状况。通过传感器集成，应用可以获取实时的健康数据，提高数据的准确性。通过Web-Native通信，我们能够充分利用OpenHarmony的传感器能力，为用户提供完整的宠物健康管理体验。
在实际开发中，建议实现健康预警机制，提供健康建议功能，并支持与兽医的数据分享。
开源鸿蒙跨平台开发社区汇聚开发者与厂商，共建“一次开发，多端部署”的开源生态，致力于降低跨端开发门槛，推动万物智联创新。
更多推荐
25
0- 0
已为社区贡献22条内容
所有评论(0)