Investasi
Add: - lib/dummy-data/investment : list master - app/(application)/(user)/investment/(tabs) Main Layout: Fix: - app/(application)/(user)/investment/create.tsx Component Add: - Progress ## No Issue
This commit is contained in:
59
app/(application)/(user)/investment/(tabs)/_layout.tsx
Normal file
59
app/(application)/(user)/investment/(tabs)/_layout.tsx
Normal file
@@ -0,0 +1,59 @@
|
||||
import { ICON_SIZE_SMALL } from "@/constants/constans-value";
|
||||
import { TabsStyles } from "@/styles/tabs-styles";
|
||||
import { Feather, FontAwesome6, Ionicons } from "@expo/vector-icons";
|
||||
import { Tabs } from "expo-router";
|
||||
|
||||
export default function InvestmentTabsLayout() {
|
||||
return (
|
||||
<Tabs screenOptions={TabsStyles}>
|
||||
<Tabs.Screen
|
||||
name="index"
|
||||
options={{
|
||||
title: "Bursa",
|
||||
tabBarIcon: ({ color }) => (
|
||||
<Ionicons
|
||||
name="bar-chart-outline"
|
||||
color={color}
|
||||
size={ICON_SIZE_SMALL}
|
||||
/>
|
||||
),
|
||||
}}
|
||||
/>
|
||||
<Tabs.Screen
|
||||
name="portofolio"
|
||||
options={{
|
||||
title: "Portofolio",
|
||||
tabBarIcon: ({ color }) => (
|
||||
<Feather name="pie-chart" color={color} size={ICON_SIZE_SMALL} />
|
||||
),
|
||||
}}
|
||||
/>
|
||||
<Tabs.Screen
|
||||
name="my-holding"
|
||||
options={{
|
||||
title: "Saham Saya",
|
||||
tabBarIcon: ({ color }) => (
|
||||
<FontAwesome6
|
||||
name="hand-holding-dollar"
|
||||
color={color}
|
||||
size={ICON_SIZE_SMALL}
|
||||
/>
|
||||
),
|
||||
}}
|
||||
/>
|
||||
<Tabs.Screen
|
||||
name="transaction"
|
||||
options={{
|
||||
title: "Transaksi",
|
||||
tabBarIcon: ({ color }) => (
|
||||
<FontAwesome6
|
||||
name="money-bill-transfer"
|
||||
color={color}
|
||||
size={ICON_SIZE_SMALL}
|
||||
/>
|
||||
),
|
||||
}}
|
||||
/>
|
||||
</Tabs>
|
||||
);
|
||||
}
|
||||
81
app/(application)/(user)/investment/(tabs)/index.tsx
Normal file
81
app/(application)/(user)/investment/(tabs)/index.tsx
Normal file
@@ -0,0 +1,81 @@
|
||||
import {
|
||||
BaseBox,
|
||||
FloatingButton,
|
||||
Grid,
|
||||
ProgressCustom,
|
||||
StackCustom,
|
||||
TextCustom,
|
||||
ViewWrapper,
|
||||
} from "@/components";
|
||||
import DUMMY_IMAGE from "@/constants/dummy-image-value";
|
||||
import dayjs from "dayjs";
|
||||
import { Image } from "expo-image";
|
||||
import { router } from "expo-router";
|
||||
import { View } from "react-native";
|
||||
|
||||
export default function InvestmentBursa() {
|
||||
return (
|
||||
<ViewWrapper
|
||||
hideFooter
|
||||
floatingButton={
|
||||
<FloatingButton onPress={() => router.push("/investment/create")} />
|
||||
}
|
||||
>
|
||||
{Array.from({ length: 10 }).map((_, index) => (
|
||||
<BaseBox key={index} paddingTop={7} paddingBottom={7}>
|
||||
<Grid>
|
||||
<Grid.Col span={5}>
|
||||
<Image
|
||||
source={DUMMY_IMAGE.background}
|
||||
style={{ width: "auto", height: 100, borderRadius: 10 }}
|
||||
/>
|
||||
</Grid.Col>
|
||||
<Grid.Col span={1}>
|
||||
<View />
|
||||
</Grid.Col>
|
||||
<Grid.Col span={6}>
|
||||
<StackCustom>
|
||||
<TextCustom truncate={2}>
|
||||
Title here : Lorem ipsum dolor sit amet consectetur
|
||||
adipisicing elit. Omnis, exercitationem, sequi enim quod
|
||||
distinctio maiores laudantium amet, quidem atque repellat sit
|
||||
vitae qui aliquam est veritatis laborum eum voluptatum totam!
|
||||
</TextCustom>
|
||||
<ProgressCustom value={index % 5 * 20} size="lg" />
|
||||
<TextCustom>
|
||||
Sisa waktu: {dayjs().diff(dayjs(), "day")} hari
|
||||
</TextCustom>
|
||||
</StackCustom>
|
||||
</Grid.Col>
|
||||
</Grid>
|
||||
</BaseBox>
|
||||
))}
|
||||
</ViewWrapper>
|
||||
);
|
||||
}
|
||||
|
||||
|
||||
// <View style={{ padding: 20, gap: 16 }}>
|
||||
// <TextCustom>Progress 70%</TextCustom>
|
||||
// <ProgressCustom value={70} color="primary" size="md" />
|
||||
|
||||
// <TextCustom>Success Progress</TextCustom>
|
||||
// <ProgressCustom value={40} color="success" size="lg" />
|
||||
|
||||
// <TextCustom>Warning Progress (small)</TextCustom>
|
||||
// <ProgressCustom value={90} color="warning" size="sm" />
|
||||
|
||||
// <TextCustom>Error Indeterminate</TextCustom>
|
||||
// <ProgressCustom value={null} color="error" size="md" />
|
||||
|
||||
// <TextCustom>Custom Radius</TextCustom>
|
||||
// <ProgressCustom value={60} color="info" size="xl" radius={4} />
|
||||
|
||||
// <ProgressCustom value={70} color="primary" size="lg" />
|
||||
|
||||
// <ProgressCustom value={45} color="success" size="md" label="Halfway!" />
|
||||
|
||||
// <ProgressCustom value={90} color="warning" size="lg" showLabel={false} />
|
||||
|
||||
// <ProgressCustom value={null} color="error" size="sm" label="Loading..." />
|
||||
// </View>;
|
||||
11
app/(application)/(user)/investment/(tabs)/my-holding.tsx
Normal file
11
app/(application)/(user)/investment/(tabs)/my-holding.tsx
Normal file
@@ -0,0 +1,11 @@
|
||||
import { ViewWrapper, TextCustom } from "@/components";
|
||||
|
||||
export default function InvestmentMyHolding() {
|
||||
return (
|
||||
<ViewWrapper>
|
||||
<TextCustom bold size="large">
|
||||
My Holding
|
||||
</TextCustom>
|
||||
</ViewWrapper>
|
||||
);
|
||||
}
|
||||
11
app/(application)/(user)/investment/(tabs)/portofolio.tsx
Normal file
11
app/(application)/(user)/investment/(tabs)/portofolio.tsx
Normal file
@@ -0,0 +1,11 @@
|
||||
import { ViewWrapper, TextCustom } from "@/components";
|
||||
|
||||
export default function InvestmentPortofolio() {
|
||||
return (
|
||||
<ViewWrapper>
|
||||
<TextCustom bold size="large">
|
||||
Portofolio
|
||||
</TextCustom>
|
||||
</ViewWrapper>
|
||||
);
|
||||
}
|
||||
11
app/(application)/(user)/investment/(tabs)/transaction.tsx
Normal file
11
app/(application)/(user)/investment/(tabs)/transaction.tsx
Normal file
@@ -0,0 +1,11 @@
|
||||
import { ViewWrapper, TextCustom } from "@/components";
|
||||
|
||||
export default function InvestmentTransaction() {
|
||||
return (
|
||||
<ViewWrapper>
|
||||
<TextCustom bold size="large">
|
||||
Transaction
|
||||
</TextCustom>
|
||||
</ViewWrapper>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user