admin
6a74db1e5c
- Copy React app structure from sample_interface/src/ - Copy package.json, vite.config.ts, postcss.config.mjs - Copy guidelines/ design system
84 lines
3.0 KiB
TypeScript
84 lines
3.0 KiB
TypeScript
import { Card, CardContent, CardHeader, CardTitle } from "../ui/card";
|
|
import { Input } from "../ui/input";
|
|
import { Button } from "../ui/button";
|
|
import { Label } from "../ui/label";
|
|
import { Activity } from "lucide-react";
|
|
|
|
export function ADCSettingView() {
|
|
const adcChannels = [
|
|
{ channel: 1, name: "Water Level", value: "2.45V", raw: "2048" },
|
|
{ channel: 2, name: "Temperature", value: "1.23V", raw: "1024" },
|
|
{ channel: 3, name: "Pressure", value: "3.12V", raw: "2600" },
|
|
{ channel: 4, name: "Flow Rate", value: "0.98V", raw: "817" },
|
|
];
|
|
|
|
return (
|
|
<div className="space-y-4">
|
|
<div className="flex items-center gap-3">
|
|
<Activity className="w-6 h-6 text-blue-400" />
|
|
<h1 className="text-2xl font-bold text-white">ADC Setting</h1>
|
|
</div>
|
|
|
|
<Card className="bg-gray-900 border-gray-700">
|
|
<CardHeader>
|
|
<CardTitle className="text-white">ADC Channel Readings</CardTitle>
|
|
</CardHeader>
|
|
<CardContent>
|
|
<div className="space-y-3">
|
|
{adcChannels.map((adc) => (
|
|
<div key={adc.channel} className="p-3 bg-gray-800 rounded">
|
|
<div className="flex justify-between items-center mb-2">
|
|
<span className="text-sm text-gray-400">Channel {adc.channel}</span>
|
|
<span className="text-sm text-blue-400 font-semibold">{adc.name}</span>
|
|
</div>
|
|
<div className="grid grid-cols-2 gap-2 text-xs">
|
|
<div>
|
|
<span className="text-gray-500">Voltage: </span>
|
|
<span className="text-green-400">{adc.value}</span>
|
|
</div>
|
|
<div>
|
|
<span className="text-gray-500">Raw: </span>
|
|
<span className="text-yellow-400">{adc.raw}</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
))}
|
|
</div>
|
|
</CardContent>
|
|
</Card>
|
|
|
|
<Card className="bg-gray-900 border-gray-700">
|
|
<CardHeader>
|
|
<CardTitle className="text-white">Calibration</CardTitle>
|
|
</CardHeader>
|
|
<CardContent className="space-y-4">
|
|
<div className="grid grid-cols-2 gap-4">
|
|
<div className="space-y-2">
|
|
<Label htmlFor="offset" className="text-gray-300">Offset</Label>
|
|
<Input
|
|
id="offset"
|
|
type="number"
|
|
defaultValue="0"
|
|
className="bg-gray-800 border-gray-700 text-white"
|
|
/>
|
|
</div>
|
|
<div className="space-y-2">
|
|
<Label htmlFor="gain" className="text-gray-300">Gain</Label>
|
|
<Input
|
|
id="gain"
|
|
type="number"
|
|
defaultValue="1"
|
|
step="0.01"
|
|
className="bg-gray-800 border-gray-700 text-white"
|
|
/>
|
|
</div>
|
|
</div>
|
|
<Button className="w-full bg-blue-600 hover:bg-blue-700">
|
|
Apply Calibration
|
|
</Button>
|
|
</CardContent>
|
|
</Card>
|
|
</div>
|
|
);
|
|
}
|