tuanta/sgw-owner-app
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

update tab

Browse Source
This commit is contained in:
MinhNN
2025-12-02 16:57:25 +07:00
parent 9ba43142e1
commit 80c02fef9d
9 changed files with 180 additions and 249 deletions
Download Patch File Download Diff File Expand all files Collapse all files

28
app/(tabs)/_layout.tsx
View File

@@ -46,16 +46,6 @@ export default function TabLayout() {
),
}}
/>
<Tabs.Screen
name="tripInfo"
options={{
title: t("navigation.trip"),
tabBarIcon: ({ color }) => (
<IconSymbol size={28} name="ferry.fill" color={color} />
),
}}
/>
<Tabs.Screen
name="diary"
options={{
@@ -66,15 +56,21 @@ export default function TabLayout() {
}}
/>
<Tabs.Screen
name="sensor"
name="manager"
options={{
title: t("navigation.sensor"),
title: t("navigation.manager"),
tabBarIcon: ({ color }) => (
<IconSymbol
size={28}
name="dot.radiowaves.left.and.right"
color={color}
<IconSymbol size={28} name="square.stack.3d.up" color={color} />
),
}}
/>
<Tabs.Screen
name="warning"
options={{
title: t("navigation.warning"),
tabBarIcon: ({ color }) => (
<IconSymbol size={28} name="bell.fill" color={color} />
),
}}
/>

28
app/(tabs)/diary.tsx
View File

@@ -1,13 +1,14 @@
import CreateOrUpdateHaulModal from "@/components/tripInfo/modal/CreateOrUpdateHaulModal";
import { useState } from "react";
import { Button, Platform, StyleSheet, View } from "react-native";
import { Platform, ScrollView, StyleSheet, Text, View } from "react-native";
import { SafeAreaView } from "react-native-safe-area-context";
export default function Warning() {
const [isShowModal, setIsShowModal] = useState(false);
export default function diary() {
return (
<SafeAreaView style={{ flex: 1 }}>
<ScrollView contentContainerStyle={styles.scrollContent}>
<View style={styles.container}>
<Text style={styles.titleText}>Nhật ký chuyến đi </Text>
</View>
</ScrollView>
</SafeAreaView>
);
}
@@ -24,24 +25,11 @@ const styles = StyleSheet.create({
fontSize: 32,
fontWeight: "700",
lineHeight: 40,
marginBottom: 10,
marginBottom: 30,
fontFamily: Platform.select({
ios: "System",
android: "Roboto",
default: "System",
}),
},
button: {
backgroundColor: "#007AFF",
paddingVertical: 14,
paddingHorizontal: 24,
borderRadius: 8,
marginTop: 20,
},
buttonText: {
color: "#fff",
fontSize: 16,
fontWeight: "600",
},
});

35
app/(tabs)/manager.tsx Normal file
View File

@@ -0,0 +1,35 @@
import { Platform, ScrollView, StyleSheet, Text, View } from "react-native";
import { SafeAreaView } from "react-native-safe-area-context";
export default function manager() {
return (
<SafeAreaView style={{ flex: 1 }}>
<ScrollView contentContainerStyle={styles.scrollContent}>
<View style={styles.container}>
<Text style={styles.titleText}>Quản lý tàu </Text>
</View>
</ScrollView>
</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",
}),
},
});

129
app/(tabs)/sensor.tsx
View File

@@ -1,129 +0,0 @@
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",
},
});

162
app/(tabs)/tripInfo.tsx
View File

@@ -1,83 +1,83 @@
import ButtonCancelTrip from "@/components/ButtonCancelTrip";
import ButtonCreateNewHaulOrTrip from "@/components/ButtonCreateNewHaulOrTrip";
import ButtonEndTrip from "@/components/ButtonEndTrip";
import CrewListTable from "@/components/tripInfo/CrewListTable";
import FishingToolsTable from "@/components/tripInfo/FishingToolsList";
import NetListTable from "@/components/tripInfo/NetListTable";
import TripCostTable from "@/components/tripInfo/TripCostTable";
import { useI18n } from "@/hooks/use-i18n";
import { useThemeContext } from "@/hooks/use-theme-context";
import { Platform, ScrollView, StyleSheet, Text, View } from "react-native";
import { SafeAreaView } from "react-native-safe-area-context";
// import ButtonCancelTrip from "@/components/ButtonCancelTrip";
// import ButtonCreateNewHaulOrTrip from "@/components/ButtonCreateNewHaulOrTrip";
// import ButtonEndTrip from "@/components/ButtonEndTrip";
// import CrewListTable from "@/components/tripInfo/CrewListTable";
// import FishingToolsTable from "@/components/tripInfo/FishingToolsList";
// import NetListTable from "@/components/tripInfo/NetListTable";
// import TripCostTable from "@/components/tripInfo/TripCostTable";
// import { useI18n } from "@/hooks/use-i18n";
// import { useThemeContext } from "@/hooks/use-theme-context";
// import { Platform, ScrollView, StyleSheet, Text, View } from "react-native";
// import { SafeAreaView } from "react-native-safe-area-context";
export default function TripInfoScreen() {
const { t } = useI18n();
const { colors } = useThemeContext();
return (
<SafeAreaView style={styles.safeArea} edges={["top", "left", "right"]}>
<View style={styles.header}>
<Text style={[styles.titleText, { color: colors.text }]}>
{t("trip.infoTrip")}
</Text>
<View style={styles.buttonWrapper}>
<ButtonCreateNewHaulOrTrip />
</View>
</View>
<ScrollView contentContainerStyle={styles.scrollContent}>
<View style={styles.container}>
<TripCostTable />
<FishingToolsTable />
<CrewListTable />
<NetListTable />
<View style={styles.buttonRow}>
<ButtonCancelTrip />
<ButtonEndTrip />
</View>
</View>
</ScrollView>
</SafeAreaView>
);
}
// export default function TripInfoScreen() {
// const { t } = useI18n();
// const { colors } = useThemeContext();
// return (
// <SafeAreaView style={styles.safeArea} edges={["top", "left", "right"]}>
// <View style={styles.header}>
// <Text style={[styles.titleText, { color: colors.text }]}>
// {t("trip.infoTrip")}
// </Text>
// <View style={styles.buttonWrapper}>
// <ButtonCreateNewHaulOrTrip />
// </View>
// </View>
// <ScrollView contentContainerStyle={styles.scrollContent}>
// <View style={styles.container}>
// <TripCostTable />
// <FishingToolsTable />
// <CrewListTable />
// <NetListTable />
// <View style={styles.buttonRow}>
// <ButtonCancelTrip />
// <ButtonEndTrip />
// </View>
// </View>
// </ScrollView>
// </SafeAreaView>
// );
// }
const styles = StyleSheet.create({
safeArea: {
flex: 1,
paddingBottom: 5,
},
scrollContent: {
flexGrow: 1,
},
header: {
width: "100%",
paddingHorizontal: 15,
paddingTop: 15,
paddingBottom: 10,
alignItems: "center",
},
buttonWrapper: {
width: "100%",
flexDirection: "row",
justifyContent: "flex-end",
},
container: {
alignItems: "center",
paddingHorizontal: 15,
},
buttonRow: {
flexDirection: "row",
gap: 10,
marginTop: 15,
marginBottom: 15,
},
titleText: {
fontSize: 32,
fontWeight: "700",
lineHeight: 40,
paddingBottom: 10,
fontFamily: Platform.select({
ios: "System",
android: "Roboto",
default: "System",
}),
},
});
// const styles = StyleSheet.create({
// safeArea: {
// flex: 1,
// paddingBottom: 5,
// },
// scrollContent: {
// flexGrow: 1,
// },
// header: {
// width: "100%",
// paddingHorizontal: 15,
// paddingTop: 15,
// paddingBottom: 10,
// alignItems: "center",
// },
// buttonWrapper: {
// width: "100%",
// flexDirection: "row",
// justifyContent: "flex-end",
// },
// container: {
// alignItems: "center",
// paddingHorizontal: 15,
// },
// buttonRow: {
// flexDirection: "row",
// gap: 10,
// marginTop: 15,
// marginBottom: 15,
// },
// titleText: {
// fontSize: 32,
// fontWeight: "700",
// lineHeight: 40,
// paddingBottom: 10,
// fontFamily: Platform.select({
// ios: "System",
// android: "Roboto",
// default: "System",
// }),
// },
// });

35
app/(tabs)/warning.tsx Normal file
View File

@@ -0,0 +1,35 @@
import { Platform, ScrollView, StyleSheet, Text, View } from "react-native";
import { SafeAreaView } from "react-native-safe-area-context";
export default function warning() {
return (
<SafeAreaView style={{ flex: 1 }}>
<ScrollView contentContainerStyle={styles.scrollContent}>
<View style={styles.container}>
<Text style={styles.titleText}>Cảnh báo</Text>
</View>
</ScrollView>
</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",
}),
},
});

2
components/ui/icon-symbol.tsx
View File

@@ -31,6 +31,8 @@ const MAPPING = {
xmark: "close",
pencil: "edit",
trash: "delete",
"square.stack.3d.up": "layers",
"bell.fill": "notifications",
} as IconMapping;
/**

4
locales/en.json
View File

@@ -29,7 +29,9 @@
"diary": "Diary",
"sensor": "Sensor",
"trip": "Trip",
"setting": "Settings"
"setting": "Settings",
"manager": "Manager",
"warning": "Warning"
},
"home": {
"welcome": "Welcome",

4
locales/vi.json
View File

@@ -29,7 +29,9 @@
"diary": "Nhật ký",
"sensor": "Cảm biến",
"trip": "Chuyến đi",
"setting": "Cài đặt"
"setting": "Cài đặt",
"manager": "Quản lý",
"warning": "Cảnh báo"
},
"home": {
"welcome": "Chào mừng",