Khởi tạo ban đầu

2025-11-28 16:59:57 +07:00
parent 2911be97b2
commit 4ba46a7df2
131 changed files with 28066 additions and 0 deletions
--- a/app/(tabs)/sensor.tsx
+++ b/app/(tabs)/sensor.tsx
@@ -0,0 +1,129 @@
+import ScanQRCode from "@/components/ScanQRCode";
+import Select from "@/components/Select";
+import { useState } from "react";
+import {
+  Platform,
+  Pressable,
+  ScrollView,
+  StyleSheet,
+  Text,
+  View,
+} from "react-native";
+import { SafeAreaView } from "react-native-safe-area-context";
+
+export default function Sensor() {
+  const [scanModalVisible, setScanModalVisible] = useState(false);
+  const [scannedData, setScannedData] = useState<string | null>(null);
+  const handleQRCodeScanned = (data: string) => {
+    setScannedData(data);
+    // Alert.alert("QR Code Scanned", `Result: ${data}`);
+  };
+
+  const handleScanPress = () => {
+    setScanModalVisible(true);
+  };
+  const [selectedValue, setSelectedValue] = useState<
+    string | number | undefined
+  >(undefined);
+
+  const options = [
+    { label: "Apple", value: "apple" },
+    { label: "Banana", value: "banana" },
+    { label: "Cherry", value: "cherry", disabled: true },
+  ];
+
+  return (
+    <SafeAreaView style={{ flex: 1 }}>
+      <ScrollView contentContainerStyle={styles.scrollContent}>
+        <View style={styles.container}>
+          <Text style={styles.titleText}>Cảm biến trên tàu</Text>
+          <Select
+            style={{ width: "80%", marginBottom: 20 }}
+            options={options}
+            value={selectedValue}
+            onChange={(val) => {
+              setSelectedValue(val);
+              console.log("Value: ", val);
+            }}
+            placeholder="Select a fruit"
+            allowClear
+          />
+          <Pressable style={styles.scanButton} onPress={handleScanPress}>
+            <Text style={styles.scanButtonText}>📱 Scan QR Code</Text>
+          </Pressable>
+
+          {scannedData && (
+            <View style={styles.resultContainer}>
+              <Text style={styles.resultLabel}>Last Scanned:</Text>
+              <Text style={styles.resultText}>{scannedData}</Text>
+            </View>
+          )}
+        </View>
+      </ScrollView>
+
+      <ScanQRCode
+        visible={scanModalVisible}
+        onClose={() => setScanModalVisible(false)}
+        onScanned={handleQRCodeScanned}
+      />
+    </SafeAreaView>
+  );
+}
+
+const styles = StyleSheet.create({
+  scrollContent: {
+    flexGrow: 1,
+  },
+  container: {
+    alignItems: "center",
+    padding: 15,
+  },
+  titleText: {
+    fontSize: 32,
+    fontWeight: "700",
+    lineHeight: 40,
+    marginBottom: 30,
+    fontFamily: Platform.select({
+      ios: "System",
+      android: "Roboto",
+      default: "System",
+    }),
+  },
+  scanButton: {
+    backgroundColor: "#007AFF",
+    paddingVertical: 14,
+    paddingHorizontal: 30,
+    borderRadius: 10,
+    marginVertical: 15,
+    shadowColor: "#000",
+    shadowOffset: { width: 0, height: 2 },
+    shadowOpacity: 0.25,
+    shadowRadius: 3.84,
+    elevation: 5,
+  },
+  scanButtonText: {
+    color: "#fff",
+    fontSize: 16,
+    fontWeight: "600",
+    textAlign: "center",
+  },
+  resultContainer: {
+    marginTop: 30,
+    padding: 15,
+    backgroundColor: "#f0f0f0",
+    borderRadius: 10,
+    minWidth: "80%",
+  },
+  resultLabel: {
+    fontSize: 14,
+    fontWeight: "600",
+    color: "#666",
+    marginBottom: 8,
+  },
+  resultText: {
+    fontSize: 14,
+    color: "#333",
+    fontFamily: "Menlo",
+    fontWeight: "500",
+  },
+});