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

Admin Collaboration

Browse Source 
Add:
- collaboration/[id]

Fix: tampilan UI
- admin/collaboration: publish, group, reject

### No Issue
This commit is contained in:
Bagasbanuna02
2025-08-08 14:21:37 +08:00
parent 72e8d7aabd
commit 25f600e8c2
12 changed files with 527 additions and 68 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -48,59 +48,36 @@ export default function AdminLayout() {
),
}}
>
<Stack.Screen name="dashboard"
// options={{ title: "Main Dashboard" }}
/>
<Stack.Screen
name="investment/index"
// options={{ title: "Dashboard Investasi" }}
/>
<Stack.Screen
name="investment/publish"
// options={{ title: "Investasi Publish" }}
/>
<Stack.Screen
name="investment/review"
// options={{ title: "Investasi Review" }}
/>
<Stack.Screen
name="investment/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="collaboration/index"
// options={{ title: "Dashboard Collaboration" }}
/>
<Stack.Screen
name="collaboration/publish"
// options={{ title: "Collaboration Publish" }}
/>
<Stack.Screen
name="collaboration/group"
// options={{ title: "Collaboration Group" }}
/>
<Stack.Screen
name="collaboration/reject"
// options={{ title: "Collaboration Reject" }}
/>
<Stack.Screen name="dashboard" />
{/* ================== Investment Start ================== */}
<Stack.Screen name="investment/index" />
<Stack.Screen name="investment/publish" />
<Stack.Screen name="investment/review" />
<Stack.Screen name="investment/reject" />
{/* ================== Investment End ================== */}
{/* ================== Maps Start ================== */}
<Stack.Screen name="maps" />
{/* ================== Maps End ================== */}
{/* ================== App Information Start ================== */}
<Stack.Screen name="app-information/index" />
{/* ================== App Information End ================== */}
{/* ================== Job Start ================== */}
<Stack.Screen name="job/index" />
<Stack.Screen name="job/publish" />
<Stack.Screen name="job/review" />
<Stack.Screen name="job/reject" />
{/* ================== Collaboration Start ================== */}
<Stack.Screen name="collaboration/index" />
<Stack.Screen name="collaboration/publish" />
<Stack.Screen name="collaboration/group" />
<Stack.Screen name="collaboration/reject" />
<Stack.Screen name="collaboration/[id]/[status]"/>
<Stack.Screen name="collaboration/[id]/group"/>
{/* ================== Collaboration End ================== */}
</Stack>
<DrawerAdmin

89
app/(application)/admin/collaboration/[id]/[status].tsx Normal file
View File

@@ -0,0 +1,89 @@
import {
BaseBox,
BoxButtonOnFooter,
ButtonCustom,
Grid,
StackCustom,
TextCustom,
ViewWrapper,
} from "@/components";
import AdminBackButtonAntTitle from "@/components/_ShareComponent/Admin/BackButtonAntTitle";
import { MainColor } from "@/constants/color-palet";
import { useLocalSearchParams } from "expo-router";
export default function AdminCollaborationPublish() {
const { id, status } = useLocalSearchParams();
console.log("params:", id, status);
const bottomFooter = (
<BoxButtonOnFooter>
<ButtonCustom
backgroundColor={MainColor.red}
textColor="white"
onPress={() => {}}
>
Reject
</ButtonCustom>
</BoxButtonOnFooter>
);
return (
<>
<ViewWrapper
headerComponent={<AdminBackButtonAntTitle title={`Detail ${status}`} />}
footerComponent={bottomFooter}
>
<BaseBox>
<StackCustom>
{listData.map((item, i) => (
<Grid key={i}>
<Grid.Col
span={4}
style={{ justifyContent: "center", paddingRight: 10 }}
>
<TextCustom bold>{item.label}</TextCustom>
</Grid.Col>
<Grid.Col span={8} style={{ justifyContent: "center" }}>
<TextCustom>{item.value}</TextCustom>
</Grid.Col>
</Grid>
))}
</StackCustom>
</BaseBox>
</ViewWrapper>
</>
);
}
const listData = [
{
label: "Username",
value: "Bagas Banuna",
},
{
label: "Judul Proyek",
value:
"Judul Proyek: Lorem ipsum dolor sit amet consectetur adipisicing elit.",
},
{
label: "Industri",
value: "Kesehatan",
},
{
label: "Jumlah Partisipan ",
value: "0",
},
{
label: "Lokasi",
value: "Kuta Selatan, Bali",
},
{
label: "Tujuan Proyek",
value:
"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.",
},
{
label: "Keuntungan",
value:
"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.",
},
];

97
app/(application)/admin/collaboration/[id]/group.tsx Normal file
View File

@@ -0,0 +1,97 @@
import {
BaseBox,
Grid,
StackCustom,
TextCustom,
ViewWrapper,
} from "@/components";
import AdminBackButtonAntTitle from "@/components/_ShareComponent/Admin/BackButtonAntTitle";
import { useLocalSearchParams } from "expo-router";
export default function AdminCollaborationGroup() {
const { id } = useLocalSearchParams();
console.log("params:", id);
return (
<>
<ViewWrapper
headerComponent={
<AdminBackButtonAntTitle title={`Detail Group ${id}`} />
}
>
<StackCustom gap={"xs"}>
<BaseBox>
<StackCustom>
{listData.map((item, i) => (
<Grid key={i}>
<Grid.Col
span={4}
style={{ justifyContent: "center", paddingRight: 10 }}
>
<TextCustom bold>{item.label}</TextCustom>
</Grid.Col>
<Grid.Col span={8} style={{ justifyContent: "center" }}>
<TextCustom>{item.value}</TextCustom>
</Grid.Col>
</Grid>
))}
</StackCustom>
</BaseBox>
<BaseBox>
<StackCustom>
<TextCustom align="center">Anggota</TextCustom>
{Array.from({ length: 10 }).map((_, i) => (
<Grid key={i}>
<Grid.Col
span={4}
style={{ justifyContent: "center", paddingRight: 10 }}
>
<TextCustom bold>Username</TextCustom>
</Grid.Col>
<Grid.Col span={8} style={{ justifyContent: "center" }}>
<TextCustom>
Lorem ipsum dolor sit amet consectetur adipisicing elit.
</TextCustom>
</Grid.Col>
</Grid>
))}
</StackCustom>
</BaseBox>
</StackCustom>
</ViewWrapper>
</>
);
}
const listData = [
{
label: "Admin Group",
value: "Bagas Banuna",
},
{
label: "Nama Group",
value: "Lorem ipsum dolor sit amet consectetur adipisicing elit.",
},
{
label: "Industri",
value: "Kesehatan",
},
{
label: "Jumlah Partisipan ",
value: "0",
},
{
label: "Lokasi",
value: "Kuta Selatan, Bali",
},
{
label: "Tujuan Proyek",
value:
"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.",
},
{
label: "Keuntungan",
value:
"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.",
},
];

64
app/(application)/admin/collaboration/group.tsx
View File

@@ -1,10 +1,68 @@
import { TextCustom, ViewWrapper } from "@/components";
import {
ActionIcon,
BaseBox,
Spacing,
StackCustom,
TextCustom,
ViewWrapper,
} from "@/components";
import AdminComp_BoxTitle from "@/components/_ShareComponent/Admin/BoxTitlePage";
import AdminTitleTable from "@/components/_ShareComponent/Admin/TableTitle";
import AdminTableValue from "@/components/_ShareComponent/Admin/TableValue";
import AdminTitlePage from "@/components/_ShareComponent/Admin/TitlePage";
import { ICON_SIZE_BUTTON } from "@/constants/constans-value";
import { Octicons } from "@expo/vector-icons";
import { router } from "expo-router";
import { Divider } from "react-native-paper";
export default function AdminCollaborationGroup() {
return (
<>
<ViewWrapper>
<TextCustom>Admin Collaboration Group</TextCustom>
<ViewWrapper headerComponent={<AdminTitlePage title="Collaboration" />}>
<StackCustom gap={"xs"}>
<AdminComp_BoxTitle title="Group" />
<BaseBox>
<AdminTitleTable
title1="Aksi"
title2="Admin Group"
title3="Nama Group"
/>
<Spacing height={10} />
<Divider />
{Array.from({ length: 10 }).map((_, index) => (
<AdminTableValue
key={index}
value1={
<ActionIcon
icon={
<Octicons
name="eye"
size={ICON_SIZE_BUTTON}
color="black"
/>
}
onPress={() => {
router.push(`/admin/collaboration/${index}/group`);
}}
/>
}
value2={
<TextCustom truncate={1}>Username username </TextCustom>
}
value3={
<TextCustom truncate={2}>
Lorem ipsum dolor sit amet consectetur adipisicing elit.
Blanditiis asperiores quidem deleniti architecto eaque et
nostrum, ad consequuntur eveniet quisquam quae voluptatum
ducimus! Dolorem nobis modi officia debitis, beatae
mollitia.
</TextCustom>
}
/>
))}
</BaseBox>
</StackCustom>
</ViewWrapper>
</>
);

32
app/(application)/admin/collaboration/index.tsx
View File

@@ -1,11 +1,37 @@
import { TextCustom, ViewWrapper } from "@/components";
import { StackCustom, ViewWrapper } from "@/components";
import AdminComp_BoxDashboard from "@/components/_ShareComponent/Admin/BoxDashboard";
import AdminTitlePage from "@/components/_ShareComponent/Admin/TitlePage";
import { MainColor } from "@/constants/color-palet";
import { Entypo, FontAwesome } from "@expo/vector-icons";
export default function AdminCollaboration() {
return (
<>
<ViewWrapper>
<TextCustom>Admin Collaboration</TextCustom>
<ViewWrapper headerComponent={<AdminTitlePage title="Collaboration" />}>
<StackCustom gap={"xs"}>
{listData.map((item, i) => (
<AdminComp_BoxDashboard key={i} item={item} />
))}
</StackCustom>
</ViewWrapper>
</>
);
}
const listData = [
{
label: "Publish",
value: 4,
icon: <Entypo name="publish" size={25} color={MainColor.green} />,
},
{
label: "Group",
value: 7,
icon: <FontAwesome name="group" size={25} color={MainColor.yellow} />,
},
{
label: "Reject",
value: 7,
icon: <FontAwesome name="warning" size={25} color={MainColor.red} />,
},
];

65
app/(application)/admin/collaboration/publish.tsx
View File

@@ -1,11 +1,70 @@
import { TextCustom, ViewWrapper } from "@/components";
import {
ActionIcon,
BaseBox,
Spacing,
StackCustom,
TextCustom,
ViewWrapper,
} from "@/components";
import AdminComp_BoxTitle from "@/components/_ShareComponent/Admin/BoxTitlePage";
import AdminTitleTable from "@/components/_ShareComponent/Admin/TableTitle";
import AdminTableValue from "@/components/_ShareComponent/Admin/TableValue";
import AdminTitlePage from "@/components/_ShareComponent/Admin/TitlePage";
import { ICON_SIZE_BUTTON } from "@/constants/constans-value";
import { Octicons } from "@expo/vector-icons";
import { router } from "expo-router";
import { Divider } from "react-native-paper";
export default function AdminCollaborationPublish() {
return (
<>
<ViewWrapper>
<TextCustom>Admin Collaboration Publish</TextCustom>
<ViewWrapper headerComponent={<AdminTitlePage title="Collaboration" />}>
<StackCustom gap={"xs"}>
<AdminComp_BoxTitle title="Publish" />
<BaseBox>
<AdminTitleTable
title1="Aksi"
title2="Username"
title3="Judul Proyek"
/>
<Spacing height={10} />
<Divider />
{Array.from({ length: 10 }).map((_, index) => (
<AdminTableValue
key={index}
value1={
<ActionIcon
icon={
<Octicons
name="eye"
size={ICON_SIZE_BUTTON}
color="black"
/>
}
onPress={() => {
router.push(`/admin/collaboration/${index}/publish`);
}}
/>
}
value2={
<TextCustom truncate={1}>Username username </TextCustom>
}
value3={
<TextCustom truncate={2}>
Lorem ipsum dolor sit amet consectetur adipisicing elit.
Blanditiis asperiores quidem deleniti architecto eaque et
nostrum, ad consequuntur eveniet quisquam quae voluptatum
ducimus! Dolorem nobis modi officia debitis, beatae
mollitia.
</TextCustom>
}
/>
))}
</BaseBox>
</StackCustom>
</ViewWrapper>
</>
);
}

64
app/(application)/admin/collaboration/reject.tsx
View File

@@ -1,10 +1,68 @@
import { TextCustom, ViewWrapper } from "@/components";
import {
ActionIcon,
BaseBox,
Spacing,
StackCustom,
TextCustom,
ViewWrapper,
} from "@/components";
import AdminComp_BoxTitle from "@/components/_ShareComponent/Admin/BoxTitlePage";
import AdminTitleTable from "@/components/_ShareComponent/Admin/TableTitle";
import AdminTableValue from "@/components/_ShareComponent/Admin/TableValue";
import AdminTitlePage from "@/components/_ShareComponent/Admin/TitlePage";
import { ICON_SIZE_BUTTON } from "@/constants/constans-value";
import { Octicons } from "@expo/vector-icons";
import { router } from "expo-router";
import { Divider } from "react-native-paper";
export default function AdminCollaborationReject() {
return (
<>
<ViewWrapper>
<TextCustom>Admin Collaboration Reject</TextCustom>
<ViewWrapper headerComponent={<AdminTitlePage title="Collaboration" />}>
<StackCustom gap={"xs"}>
<AdminComp_BoxTitle title="Reject" />
<BaseBox>
<AdminTitleTable
title1="Aksi"
title2="Username"
title3="Judul Proyek"
/>
<Spacing height={10} />
<Divider />
{Array.from({ length: 10 }).map((_, index) => (
<AdminTableValue
key={index}
value1={
<ActionIcon
icon={
<Octicons
name="eye"
size={ICON_SIZE_BUTTON}
color="black"
/>
}
onPress={() => {
router.push(`/admin/collaboration/${index}/reject`);
}}
/>
}
value2={
<TextCustom truncate={1}>Username username </TextCustom>
}
value3={
<TextCustom truncate={2}>
Lorem ipsum dolor sit amet consectetur adipisicing elit.
Blanditiis asperiores quidem deleniti architecto eaque et
nostrum, ad consequuntur eveniet quisquam quae voluptatum
ducimus! Dolorem nobis modi officia debitis, beatae
mollitia.
</TextCustom>
}
/>
))}
</BaseBox>
</StackCustom>
</ViewWrapper>
</>
);

4
components/_ShareComponent/Admin/BoxDashboard.tsx
View File

@@ -3,7 +3,7 @@ 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";
import { AccentColor, MainColor } from "@/constants/color-palet";
interface BoxDashboardProps {
item: {
@@ -37,7 +37,7 @@ export default function AdminComp_BoxDashboard({ item }: BoxDashboardProps) {
span={3}
style={{ alignItems: "flex-start", justifyContent: "center" }}
>
<CircleContainer icon={item.icon} />
<CircleContainer style={{ backgroundColor: MainColor.white, borderColor: AccentColor.blue }} icon={item.icon} />
</Grid.Col>
</Grid>
</BaseBox>

28
components/_ShareComponent/Admin/TableTitle.tsx Normal file
View File

@@ -0,0 +1,28 @@
import Grid from "@/components/Grid/GridCustom";
import TextCustom from "@/components/Text/TextCustom";
export default function AdminTitleTable({
title1,
title2,
title3,
}: {
title1: string;
title2: string;
title3: string;
}) {
return (
<>
<Grid>
<Grid.Col span={3} style={{ alignItems: "center", justifyContent: "center" }}>
<TextCustom bold align="center">{title1}</TextCustom>
</Grid.Col>
<Grid.Col span={3} style={{ alignItems: "center", justifyContent: "center" }}>
<TextCustom bold align="center">{title2}</TextCustom>
</Grid.Col>
<Grid.Col span={6} style={{ alignItems: "center", justifyContent: "center" }}>
<TextCustom bold align="center">{title3}</TextCustom>
</Grid.Col>
</Grid>
</>
);
}

56
components/_ShareComponent/Admin/TableValue.tsx Normal file
View File

@@ -0,0 +1,56 @@
import Grid from "@/components/Grid/GridCustom";
import React from "react";
import { View } from "react-native";
import { Divider } from "react-native-paper";
export default function AdminTableValue({
value1,
value2,
value3,
}: {
value1: React.ReactNode;
value2: React.ReactNode;
value3: React.ReactNode;
}) {
return (
<>
<View style={{ paddingVertical: 5 }}>
<Grid>
<Grid.Col
span={3}
style={{
alignItems: "center",
justifyContent: "center",
paddingLeft: 5,
paddingRight: 5,
}}
>
{value1}
</Grid.Col>
<Grid.Col
span={3}
style={{
alignItems: "center",
justifyContent: "center",
paddingLeft: 5,
paddingRight: 5,
}}
>
{value2}
</Grid.Col>
<Grid.Col
span={6}
style={{
justifyContent: "center",
paddingLeft: 5,
paddingRight: 5,
}}
>
{value3}
</Grid.Col>
</Grid>
<Divider />
</View>
</>
);
}

11
components/_ShareComponent/Admin/TitlePage.tsx Normal file
View File

@@ -0,0 +1,11 @@
import TextCustom from "@/components/Text/TextCustom";
export default function AdminTitlePage({ title }: { title: string }) {
return (
<>
<TextCustom bold size={30}>
{title}
</TextCustom>
</>
);
}

2
screens/Authentication/LoginView.tsx
View File

@@ -84,7 +84,7 @@ export default function LoginView() {
<Spacing />
<ButtonCustom onPress={() => router.navigate("/admin/user-access")}>
<ButtonCustom onPress={() => router.navigate("/admin/collaboration")}>
Admin ( Delete Soon )
</ButtonCustom>
</View>