smart_garden_server/imports/ui/SensorCardDeck.jsx
2020-07-24 20:24:46 +02:00

96 lines
3.4 KiB
JavaScript

import React from 'react'
import { Card, CardDeck } from 'react-bootstrap';
import {
ActiveDeviceCollection,
ConfiguredDevicesCollection,
PlantTypesCollection,
SensorDataCollection
} from "../../client/main";
import {useTracker} from 'meteor/react-meteor-data';
export default function SensorCardDeck() {
const deviceId = useTracker(() => {
return ActiveDeviceCollection.find().fetch()[0];
});
const sensorData = useTracker(() => {
if (deviceId === null || deviceId === undefined) {
return undefined;
} else {
return SensorDataCollection.find({device_id: deviceId.deviceId}, {sort: {timestamp: -1}, limit: 1}).fetch();
}
});
const plantType = useTracker(() => {
if (deviceId === null || deviceId === undefined) {
return undefined;
} else {
return ConfiguredDevicesCollection.findOne({deviceId: deviceId.deviceId});
}
});
const plantTypeData = useTracker(() => {
if (plantType === null || plantType === undefined) {
return undefined;
} else {
return PlantTypesCollection.findOne({plantType: plantType.type});
}
});
if (sensorData.length <= 0 || plantType === undefined || deviceId === undefined || plantTypeData === undefined) {
return (
<CardDeck>
<Card>
<Card.Body>
<Card.Title>Loading!</Card.Title>
<Card.Text>Please wait...</Card.Text>
</Card.Body>
</Card>
</CardDeck>
)
} else {
return (
<CardDeck>
{sensorData[0].temperature < plantTypeData.data.temperature.minTemp ?
<Card border={'danger'}>
<Card.Body>
<Card.Title>Temperature</Card.Title>
<Card.Text>{sensorData[0].temperature} °C</Card.Text>
</Card.Body>
</Card> :
<Card>
<Card.Body>
<Card.Title>Temperature</Card.Title>
<Card.Text>{sensorData[0].temperature} °C</Card.Text>
</Card.Body>
</Card>}
<Card>
<Card.Body>
<Card.Title>Humidity</Card.Title>
<Card.Text>{sensorData[0].humidity} %</Card.Text>
</Card.Body>
</Card>
<Card>
<Card.Body>
<Card.Title>Brightness</Card.Title>
<Card.Text>{sensorData[0].brightness} lux</Card.Text>
</Card.Body>
</Card>
{sensorData[0].moisture > plantTypeData.data.soilMoisture.sat ?
<Card border={'danger'}>
<Card.Body>
<Card.Title>Moisture</Card.Title>
<Card.Text>{sensorData[0].moisture} %</Card.Text>
</Card.Body>
</Card> :
<Card>
<Card.Body>
<Card.Title>Moisture</Card.Title>
<Card.Text>{sensorData[0].moisture} %</Card.Text>
</Card.Body>
</Card>}
</CardDeck>
)
}
}