wibu/hipmi-mobile
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Admin

Browse Source 
App-Information
Add:
- screens/Admin/App-Information
- _ShareComponent/Admin
- app/(application)/admin/app-information

### No Issue
This commit is contained in:
Bagasbanuna02
2025-08-06 17:35:30 +08:00
parent bcc0e02581
commit d47fff469b
15 changed files with 326 additions and 49 deletions
Download Patch File Download Diff File Expand all files Collapse all files

45
app/(application)/admin/_layout.tsx
View File

@@ -23,6 +23,7 @@ export default function AdminLayout() {
<>
<Stack
screenOptions={{
title: "HIPMI DASHBOARD",
headerStyle: GStyles.headerStyle,
headerTitleStyle: GStyles.headerTitleStyle,
headerTitleAlign: "center",
@@ -47,44 +48,58 @@ export default function AdminLayout() {
),
}}
>
<Stack.Screen name="dashboard" options={{ title: "Main Dashboard" }} />
<Stack.Screen name="dashboard"
// options={{ title: "Main Dashboard" }}
/>
<Stack.Screen
name="investment/index"
options={{ title: "Dashboard Investasi" }}
// options={{ title: "Dashboard Investasi" }}
/>
<Stack.Screen
name="investment/publish"
options={{ title: "Investasi Publish" }}
// options={{ title: "Investasi Publish" }}
/>
<Stack.Screen
name="investment/review"
options={{ title: "Investasi Review" }}
// options={{ title: "Investasi Review" }}
/>
<Stack.Screen
name="investment/reject"
options={{ title: "Investasi Reject" }}
// options={{ title: "Investasi Reject" }}
/>
<Stack.Screen name="maps"
// options={{ title: "Maps" }}
/>
<Stack.Screen name="app-information/index"
// options={{ title: "Information" }}
/>
<Stack.Screen name="job/index"
// options={{ title: "Dashboard Job" }}
/>
<Stack.Screen name="job/publish"
// options={{ title: "Job Publish" }}
/>
<Stack.Screen name="job/review"
// options={{ title: "Job Review" }}
/>
<Stack.Screen name="job/reject"
// options={{ title: "Job Reject" }}
/>
<Stack.Screen name="maps" options={{ title: "Maps" }} />
<Stack.Screen name="information" options={{ title: "Information" }} />
<Stack.Screen name="job/index" options={{ title: "Dashboard Job" }} />
<Stack.Screen name="job/publish" options={{ title: "Job Publish" }} />
<Stack.Screen name="job/review" options={{ title: "Job Review" }} />
<Stack.Screen name="job/reject" options={{ title: "Job Reject" }} />
<Stack.Screen
name="collaboration/index"
options={{ title: "Dashboard Collaboration" }}
// options={{ title: "Dashboard Collaboration" }}
/>
<Stack.Screen
name="collaboration/publish"
options={{ title: "Collaboration Publish" }}
// options={{ title: "Collaboration Publish" }}
/>
<Stack.Screen
name="collaboration/group"
options={{ title: "Collaboration Group" }}
// options={{ title: "Collaboration Group" }}
/>
<Stack.Screen
name="collaboration/reject"
options={{ title: "Collaboration Reject" }}
// options={{ title: "Collaboration Reject" }}
/>
</Stack>

62
app/(application)/admin/app-information/index.tsx Normal file
View File

@@ -0,0 +1,62 @@
import {
ScrollableCustom,
ViewWrapper
} from "@/components";
import AdminAppInformation_BusinessFieldSection from "@/screens/Admin/App-Information/BusinessFieldSection";
import AdminAppInformation_Bank from "@/screens/Admin/App-Information/InformationBankSection";
import AdminAppInformation_StickerSection from "@/screens/Admin/App-Information/StickerSection";
import { useState } from "react";
export default function AdminInformation() {
const [activeCategory, setActiveCategory] = useState<string | null>("bank");
const handlePress = (item: any) => {
setActiveCategory(item.value);
// tambahkan logika lain seperti filter dsb.
};
const scrollComponent = (
<ScrollableCustom
data={[
{
id: "1",
label: "Informasi Bank",
value: "bank",
},
{
id: "2",
label: "Bidang Bisnis",
value: "business",
},
{
id: "3",
label: "Stiker",
value: "sticker",
},
]}
onButtonPress={handlePress}
activeId={activeCategory as any}
/>
);
const renderContent = () => {
switch (activeCategory) {
case "bank":
return <AdminAppInformation_Bank />;
case "business":
return <AdminAppInformation_BusinessFieldSection />;
case "sticker":
return <AdminAppInformation_StickerSection />;
default:
return <AdminAppInformation_Bank />;
}
};
return (
<>
<ViewWrapper headerComponent={scrollComponent}>
{renderContent()}
</ViewWrapper>
</>
);
}

33
app/(application)/admin/dashboard.tsx
View File

@@ -1,11 +1,40 @@
import { TextCustom, ViewWrapper } from "@/components";
import {
StackCustom,
TextCustom,
ViewWrapper
} from "@/components";
import AdminComp_BoxDashboard from "@/components/_ShareComponent/Admin/BoxDashboard";
import { MainColor } from "@/constants/color-palet";
import { Ionicons } from "@expo/vector-icons";
export default function AdminDashboard() {
return (
<>
<ViewWrapper>
<TextCustom>Admin Dashboard</TextCustom>
<StackCustom>
<TextCustom bold size={30}>
Main Dashboard
</TextCustom>
{listData.map((item, i) => (
<AdminComp_BoxDashboard key={i} item={item} />
))}
</StackCustom>
</ViewWrapper>
</>
);
}
const listData = [
{
label: "User",
value: 4,
icon: <Ionicons name="people" size={30} color={MainColor.yellow} />,
},
{
label: "Portofolio",
value: 7,
icon: (
<Ionicons name="id-card-outline" size={30} color={MainColor.yellow} />
),
},
];

11
app/(application)/admin/information.tsx
View File

@@ -1,11 +0,0 @@
import { TextCustom, ViewWrapper } from "@/components";
export default function AdminInformation() {
return (
<>
<ViewWrapper>
<TextCustom>Information</TextCustom>
</ViewWrapper>
</>
);
}

4
app/(application)/admin/maps.tsx
View File

@@ -1,10 +1,10 @@
import { TextCustom, ViewWrapper } from "@/components";
import { MapCustom, ViewWrapper } from "@/components";
export default function AdminMaps() {
return (
<>
<ViewWrapper>
<TextCustom>Maps</TextCustom>
<MapCustom height={"100%"} />
</ViewWrapper>
</>
);

16
components/Container/CircleContainer.tsx
View File

@@ -1,15 +1,20 @@
import { MainColor } from "@/constants/color-palet";
import React from "react";
import { StyleSheet, TextInput, View } from "react-native";
import { StyleProp, StyleSheet, TextInput, View, ViewStyle } from "react-native";
interface CircularInputProps {
value: string | number;
onChange?: (value: string) => void;
value?: string | number
onChange?: (value: string | number) => void;
icon?: React.ReactNode;
style?: StyleProp<ViewStyle>
}
const CircularInput: React.FC<CircularInputProps> = ({ value, onChange }) => {
const CircularInput: React.FC<CircularInputProps> = ({ value, onChange, icon, style }) => {
return (
<View style={styles.circleContainer}>
<View style={[styles.circleContainer, style]}>
{icon ? (
icon
) : (
<TextInput
value={String(value)}
onChangeText={onChange}
@@ -17,6 +22,7 @@ const CircularInput: React.FC<CircularInputProps> = ({ value, onChange }) => {
keyboardType="numeric"
maxLength={2} // Batasan maksimal karakter
/>
)}
</View>
);
};

4
components/Divider/Divider.tsx
View File

@@ -2,8 +2,8 @@ import { AccentColor } from "@/constants/color-palet";
import { View } from "react-native";
export default function Divider({
color = AccentColor.blue,
size = 1,
color = AccentColor.white,
size = 0.5,
marginTop= 12,
marginBottom= 12,
}: {

5
components/Text/TextCustom.tsx
View File

@@ -22,7 +22,7 @@ interface TextCustomProps {
style?: StyleProp<TextStyle>;
bold?: boolean;
semiBold?: boolean;
size?: "default" | "large" | "small" | "xlarge";
size?: "default" | "large" | "small" | "xlarge" | number
color?: "default" | "yellow" | "red" | "gray" | "green" | "black"
align?: TextAlign; // Prop untuk alignment
truncate?: boolean | number;
@@ -54,6 +54,7 @@ const TextCustom: React.FC<TextCustomProps> = ({
if (size === "large") selectedStyles.push(styles.large);
else if (size === "xlarge") selectedStyles.push(styles.xlarge);
else if (size === "small") selectedStyles.push(styles.small);
else if (typeof size === "number") selectedStyles.push({ fontSize: size });
// Color
if (color === "yellow") selectedStyles.push(styles.yellow);
@@ -105,7 +106,7 @@ export const styles = StyleSheet.create({
fontSize: TEXT_SIZE_MEDIUM,
color: MainColor.white,
fontFamily: "Poppins-Regular",
lineHeight: 20,
// lineHeight: 20,
},
bold: {
fontFamily: "Poppins-Bold",

46
components/_ShareComponent/Admin/BoxDashboard.tsx Normal file
View File

@@ -0,0 +1,46 @@
import BaseBox from "@/components/Box/BaseBox";
import CircleContainer from "@/components/Container/CircleContainer";
import Grid from "@/components/Grid/GridCustom";
import StackCustom from "@/components/Stack/StackCustom";
import TextCustom from "@/components/Text/TextCustom";
import { MainColor } from "@/constants/color-palet";
interface BoxDashboardProps {
item: {
label: string;
value: string | number;
icon: React.ReactNode;
};
}
export default function AdminComp_BoxDashboard({ item }: BoxDashboardProps) {
return (
<>
<BaseBox
backgroundColor={MainColor.soft_darkblue}
paddingTop={5}
paddingBottom={5}
>
<Grid containerStyle={{ marginBlock: 0 }}>
<Grid.Col
span={9}
style={{
paddingLeft: 10,
}}
>
<StackCustom gap={"xs"}>
<TextCustom bold>{item.label}</TextCustom>
<TextCustom size={50}>{item.value}</TextCustom>
</StackCustom>
</Grid.Col>
<Grid.Col
span={3}
style={{ alignItems: "flex-start", justifyContent: "center" }}
>
<CircleContainer icon={item.icon} />
</Grid.Col>
</Grid>
</BaseBox>
</>
);
}

16
components/_ShareComponent/Admin/BoxTitlePage.tsx Normal file
View File

@@ -0,0 +1,16 @@
import BaseBox from "@/components/Box/BaseBox";
import TextCustom from "@/components/Text/TextCustom";
import { TEXT_SIZE_LARGE } from "@/constants/constans-value";
export default function AdminComp_BoxTitle({ title , rightComponent}: { title: string , rightComponent?: React.ReactNode}) {
return (
<>
<BaseBox style={{ flexDirection: "row", justifyContent: "space-between" }}>
<TextCustom style={{ alignSelf: "center" }} bold size={TEXT_SIZE_LARGE}>
{title}
</TextCustom>
{rightComponent}
</BaseBox>
</>
);
}

9
screens/Admin/App-Information/BusinessFieldSection.tsx Normal file
View File

@@ -0,0 +1,9 @@
import AdminComp_BoxTitle from "@/components/_ShareComponent/Admin/BoxTitlePage";
export default function AdminAppInformation_BusinessFieldSection() {
return (
<>
<AdminComp_BoxTitle title="Bidang Bisnis" />
</>
);
}

95
screens/Admin/App-Information/InformationBankSection.tsx Normal file
View File

@@ -0,0 +1,95 @@
import {
BaseBox,
ButtonCustom,
Divider,
Grid,
TextCustom
} from "@/components";
import AdminComp_BoxTitle from "@/components/_ShareComponent/Admin/BoxTitlePage";
import { MainColor } from "@/constants/color-palet";
import { ICON_SIZE_SMALL } from "@/constants/constans-value";
import { dummyMasterBank } from "@/lib/dummy-data/_master/bank";
import { FontAwesome5, Ionicons } from "@expo/vector-icons";
import { useState } from "react";
import { TouchableOpacity, View } from "react-native";
import { Switch } from "react-native-paper";
export default function AdminAppInformation_Bank() {
const [value, setValue] = useState(false);
return (
<>
<AdminComp_BoxTitle
title="Bank"
rightComponent={
<TouchableOpacity
activeOpacity={0.7}
style={{
backgroundColor: MainColor.yellow,
padding: 5,
borderRadius: 50,
}}
onPress={() => {}}
>
<Ionicons name="add" size={16} color="black" />
</TouchableOpacity>
}
/>
<BaseBox>
<Grid>
<Grid.Col span={4} style={{ alignItems: "center" }}>
<TextCustom bold>Aksi</TextCustom>
</Grid.Col>
<Grid.Col span={4} style={{ alignItems: "center" }}>
<TextCustom bold>Status</TextCustom>
</Grid.Col>
<Grid.Col span={4}>
<TextCustom bold>Nama Bank</TextCustom>
</Grid.Col>
</Grid>
<Divider />
{dummyMasterBank.map((e, i) => (
<View key={i}>
<Grid>
<Grid.Col span={4}>
<ButtonCustom
iconLeft={
<FontAwesome5
name="edit"
size={ICON_SIZE_SMALL}
color="black"
/>
}
onPress={() => {}}
>
Edit
</ButtonCustom>
</Grid.Col>
<Grid.Col
span={4}
style={{ alignItems: "center", justifyContent: "center" }}
>
<Switch
value={value}
onValueChange={() => {
setValue(!value);
}}
theme={{
colors: {
primary: MainColor.yellow,
},
}}
/>
</Grid.Col>
<Grid.Col span={4} style={{ justifyContent: "center" }}>
<TextCustom>{e.code}</TextCustom>
</Grid.Col>
</Grid>
<Divider />
</View>
))}
</BaseBox>
</>
);
}

9
screens/Admin/App-Information/StickerSection.tsx Normal file
View File

@@ -0,0 +1,9 @@
import AdminComp_BoxTitle from "@/components/_ShareComponent/Admin/BoxTitlePage";
export default function AdminAppInformation_StickerSection() {
return (
<>
<AdminComp_BoxTitle title="Sticker" />
</>
);
}

2
screens/Admin/listPageAdmin.tsx
View File

@@ -86,7 +86,7 @@ const adminListMenu: NavbarItem[] = [
{
label: "App Information",
icon: "information-circle",
link: "/admin/information",
link: "/admin/app-information",
},
{
label: "User Access",

4
screens/Authentication/LoginView.tsx
View File

@@ -32,7 +32,7 @@ export default function LoginView() {
// router.navigate("/verification");
// router.navigate(`/(application)/(user)/profile/${id}`);
router.navigate("/(application)/(user)/home");
// router.navigate("/(application)/(user)/home");
// router.navigate(`/(application)/profile/${id}/edit`);
// router.navigate(`/(application)/(user)/portofolio/${id}`)
// router.navigate(`/(application)/(image)/preview-image/${id}`);
@@ -40,7 +40,7 @@ export default function LoginView() {
// router.replace("/(application)/coba");
// router.navigate("/investment/(tabs)")1
// router.navigate("/crowdfunding")
// router.navigate("/admin/dashboard")
router.navigate("/admin/dashboard")
}
return (