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

Integrasi API: Admin Collaboration

Browse Source 
Fix: Tampilan yang terintegrasi API
 - app/(application)/(user)/collaboration/[id]/edit.tsx
 - app/(application)/admin/collaboration/[id]/[status].tsx
 - app/(application)/admin/collaboration/[id]/group.tsx
 - app/(application)/admin/collaboration/[id]/reject-input.tsx
 - app/(application)/admin/collaboration/group.tsx
 - app/(application)/admin/collaboration/index.tsx
 - app/(application)/admin/collaboration/publish.tsx
 - app/(application)/admin/collaboration/reject.tsx
 - components/_ShareComponent/Admin/TableValue.tsx
 - screens/Collaboration/BoxPublishSection.tsx
 - service/api-admin/api-admin-collaboration.ts

### No Issue
This commit is contained in:
Bagasbanuna02
2025-10-16 14:48:31 +08:00
parent 9faa0b0f64
commit 6f4dd79568
11 changed files with 325 additions and 162 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
app/(application)/(user)/collaboration/[id]/edit.tsx
View File

@@ -19,7 +19,6 @@ import Toast from "react-native-toast-message";
export default function CollaborationEdit() {
const { id } = useLocalSearchParams();
console.log("id :", id);
const [data, setData] = useState<any>();
const [listMaster, setListMaster] = useState<any[]>([]);
const [loadingData, setLoadingData] = useState(false);

16
app/(application)/admin/collaboration/[id]/[status].tsx
View File

@@ -9,6 +9,7 @@ import {
ViewWrapper,
} from "@/components";
import AdminBackButtonAntTitle from "@/components/_ShareComponent/Admin/BackButtonAntTitle";
import GridTwoView from "@/components/_ShareComponent/GridTwoView";
import { MainColor } from "@/constants/color-palet";
import { apiAdminCollaborationGetById } from "@/service/api-admin/api-admin-collaboration";
import { router, useFocusEffect, useLocalSearchParams } from "expo-router";
@@ -28,7 +29,7 @@ export default function AdminCollaborationPublish() {
try {
const response = await apiAdminCollaborationGetById({
id: id as string,
category: status as "publish" | "reject" | "group",
category: status as any,
});
if (response.success) {
@@ -39,7 +40,7 @@ export default function AdminCollaborationPublish() {
}
};
const bottomFooter = (
const bottomFooter = status === "publish" && (
<BoxButtonOnFooter>
<ButtonCustom
backgroundColor={MainColor.red}
@@ -76,6 +77,17 @@ export default function AdminCollaborationPublish() {
))}
</StackCustom>
</BaseBox>
{data?.report && (
<BaseBox>
<GridTwoView
spanLeft={4}
spanRight={8}
leftIcon={<TextCustom bold>Catatan report</TextCustom>}
rightIcon={<TextCustom>{data?.report}</TextCustom>}
/>
</BaseBox>
)}
</ViewWrapper>
</>
);

102
app/(application)/admin/collaboration/[id]/group.tsx
View File

@@ -1,3 +1,4 @@
/* eslint-disable react-hooks/exhaustive-deps */
import {
BaseBox,
Grid,
@@ -6,23 +7,45 @@ import {
ViewWrapper,
} from "@/components";
import AdminBackButtonAntTitle from "@/components/_ShareComponent/Admin/BackButtonAntTitle";
import { useLocalSearchParams } from "expo-router";
import { apiAdminCollaborationGetById } from "@/service/api-admin/api-admin-collaboration";
import { useFocusEffect, useLocalSearchParams } from "expo-router";
import { useCallback, useState } from "react";
export default function AdminCollaborationGroup() {
const { id } = useLocalSearchParams();
console.log("params:", id);
const [data, setData] = useState<any | null>(null);
useFocusEffect(
useCallback(() => {
onLoadData();
}, [id])
);
const onLoadData = async () => {
try {
const response = await apiAdminCollaborationGetById({
id: id as string,
category: "group",
});
if (response.success) {
setData(response.data);
}
} catch (error) {
console.log("[ERROR]", error);
}
};
return (
<>
<ViewWrapper
headerComponent={
<AdminBackButtonAntTitle title={`Detail Group ${id}`} />
}
headerComponent={<AdminBackButtonAntTitle title={`Detail Group`} />}
>
<StackCustom gap={"xs"}>
<BaseBox>
<StackCustom>
{listData.map((item, i) => (
<Grid key={i}>
{listData(data).map((item: any, index: number) => (
<Grid key={index}>
<Grid.Col
span={4}
style={{ justifyContent: "center", paddingRight: 10 }}
@@ -40,21 +63,36 @@ export default function AdminCollaborationGroup() {
<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>
))}
{data?.ProjectCollaboration_AnggotaRoomChat?.map(
(item: any, index: number) => (
<StackCustom key={index} gap={0}>
<Grid>
<Grid.Col
span={4}
style={{ justifyContent: "center", paddingRight: 10 }}
>
<TextCustom bold>Nama</TextCustom>
</Grid.Col>
<Grid.Col span={8} style={{ justifyContent: "center" }}>
<TextCustom>
{item?.User?.Profile?.name || "-"}
</TextCustom>
</Grid.Col>
</Grid>
<Grid>
<Grid.Col
span={4}
style={{ justifyContent: "center", paddingRight: 10 }}
>
<TextCustom bold>Username</TextCustom>
</Grid.Col>
<Grid.Col span={8} style={{ justifyContent: "center" }}>
<TextCustom>{item?.User?.username || "-"}</TextCustom>
</Grid.Col>
</Grid>
</StackCustom>
)
)}
</StackCustom>
</BaseBox>
</StackCustom>
@@ -63,35 +101,35 @@ export default function AdminCollaborationGroup() {
);
}
const listData = [
const listData = (data: any) => [
{
label: "Admin Group",
value: "Bagas Banuna",
value: data?.ProjectCollaboration?.Author?.username || "-",
},
{
label: "Nama Group",
value: "Lorem ipsum dolor sit amet consectetur adipisicing elit.",
value: data?.name || "-",
},
{
label: "Industri",
value: "Kesehatan",
value:
data?.ProjectCollaboration?.ProjectCollaborationMaster_Industri?.name ||
"-",
},
{
label: "Jumlah Partisipan ",
value: "0",
value: data?.ProjectCollaboration_AnggotaRoomChat?.length || "-",
},
{
label: "Lokasi",
value: "Kuta Selatan, Bali",
value: data?.ProjectCollaboration?.lokasi || "-",
},
{
label: "Tujuan Proyek",
value:
"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.",
value: data?.ProjectCollaboration?.purpose || "-",
},
{
label: "Keuntungan",
value:
"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.",
value: data?.ProjectCollaboration?.benefit || "-",
},
];

41
app/(application)/admin/collaboration/[id]/reject-input.tsx
View File

@@ -6,12 +6,41 @@ import {
} from "@/components";
import AdminBackButtonAntTitle from "@/components/_ShareComponent/Admin/BackButtonAntTitle";
import AdminButtonReject from "@/components/_ShareComponent/Admin/ButtonReject";
import { apiAdminCollaborationReject } from "@/service/api-admin/api-admin-collaboration";
import { router, useLocalSearchParams } from "expo-router";
import { useState } from "react";
import Toast from "react-native-toast-message";
export default function AdminCollaborationRejectInput() {
const { id } = useLocalSearchParams();
const [value, setValue] = useState(id as string);
const [value, setValue] = useState("");
const handlerReject = async () => {
console.log("value:", value);
// router.replace(`/admin/job/reject/status`);
try {
const response = await apiAdminCollaborationReject({
id: id as string,
data: value,
});
if (!response.success) {
Toast.show({
type: "error",
text1: "Report gagal",
});
}
Toast.show({
type: "success",
text1: "Report berhasil",
});
router.back();
} catch (error) {
console.log("[ERROR]", error);
}
};
const buttonSubmit = (
<BoxButtonOnFooter>
@@ -23,12 +52,8 @@ export default function AdminCollaborationRejectInput() {
message: "Apakah anda yakin ingin menolak data ini?",
textLeft: "Batal",
textRight: "Ya",
onPressLeft: () => {
router.back();
},
onPressRight: () => {
console.log("value:", value);
// router.replace(`/admin/job/reject/status`);
handlerReject();
},
})
}
@@ -40,7 +65,9 @@ export default function AdminCollaborationRejectInput() {
<>
<ViewWrapper
footerComponent={buttonSubmit}
headerComponent={<AdminBackButtonAntTitle title="Penolakan Collaboration" />}
headerComponent={
<AdminBackButtonAntTitle title="Penolakan Collaboration" />
}
>
<TextAreaCustom
value={value}

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

@@ -1,67 +1,101 @@
import {
ActionIcon,
BaseBox,
Spacing,
LoaderCustom,
StackCustom,
TextCustom,
ViewWrapper,
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 { apiAdminCollaboration } from "@/service/api-admin/api-admin-collaboration";
import { Octicons } from "@expo/vector-icons";
import { router } from "expo-router";
import { router, useFocusEffect } from "expo-router";
import _ from "lodash";
import { useCallback, useState } from "react";
import { View } from "react-native";
import { Divider } from "react-native-paper";
export default function AdminCollaborationGroup() {
const [list, setList] = useState<any[] | null>(null);
const [loadList, setLoadList] = useState(false);
useFocusEffect(
useCallback(() => {
handlerLoadList();
}, [])
);
const handlerLoadList = async () => {
try {
setLoadList(true);
const response = await apiAdminCollaboration({
category: "group",
});
if (response.success) {
setList(response.data);
}
} catch (error) {
console.log("[ERROR]", error);
} finally {
setLoadList(false);
}
};
return (
<>
<ViewWrapper headerComponent={<AdminTitlePage title="Collaboration" />}>
<StackCustom gap={"xs"}>
<StackCustom>
<AdminComp_BoxTitle title="Group" />
<BaseBox>
<>
<AdminTitleTable
title1="Aksi"
title2="Admin Group"
title3="Nama Group"
title2="Jumlah peserta"
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"
{loadList ? (
<LoaderCustom />
) : _.isEmpty(list) ? (
<TextCustom align="center" color="gray">
Belum ada data
</TextCustom>
) : (
list?.map((item: any, index: number) => (
<View key={index}>
<AdminTableValue
value1={
<ActionIcon
icon={
<Octicons
name="eye"
size={ICON_SIZE_BUTTON}
color="black"
/>
}
onPress={() => {
router.push(`/admin/collaboration/${item.id}/group`);
}}
/>
}
onPress={() => {
router.push(`/admin/collaboration/${index}/group`);
}}
value2={
<TextCustom truncate={1}>
{item?.ProjectCollaboration_AnggotaRoomChat?.length ||
"-"}
</TextCustom>
}
value3={
<TextCustom truncate={2}>{item?.name || "-"}</TextCustom>
}
/>
}
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>
</View>
))
)}
</>
</StackCustom>
</ViewWrapper>
</>

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

@@ -9,7 +9,6 @@ import { useCallback, useState } from "react";
export default function AdminCollaboration() {
const [list, setList] = useState<any | null>(null);
const [loadList, setLoadList] = useState(false);
useFocusEffect(
useCallback(() => {
@@ -19,7 +18,6 @@ export default function AdminCollaboration() {
const handlerLoadList = async () => {
try {
setLoadList(true);
const response = await apiAdminCollaboration({
category: "dashboard",
});
@@ -31,8 +29,6 @@ export default function AdminCollaboration() {
}
} catch (error) {
console.log("[ERROR]", error);
} finally {
setLoadList(false);
}
};

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

@@ -15,6 +15,7 @@ import { Octicons } from "@expo/vector-icons";
import { router, useFocusEffect } from "expo-router";
import _ from "lodash";
import { useCallback, useState } from "react";
import { View } from "react-native";
import { Divider } from "react-native-paper";
export default function AdminCollaborationPublish() {
@@ -43,10 +44,11 @@ export default function AdminCollaborationPublish() {
setLoadList(false);
}
};
return (
<>
<ViewWrapper headerComponent={<AdminTitlePage title="Collaboration" />}>
<StackCustom gap={"xs"}>
<StackCustom>
<AdminComp_BoxTitle title="Publish" />
<AdminTitleTable
@@ -60,36 +62,39 @@ export default function AdminCollaborationPublish() {
{loadList ? (
<LoaderCustom />
) : _.isEmpty(list) ? (
<TextCustom>Belum ada data</TextCustom>
<TextCustom align="center" color="gray">
Belum ada data
</TextCustom>
) : (
list?.map((item: any, index: number) => (
<AdminTableValue
key={index}
value1={
<ActionIcon
icon={
<Octicons
name="eye"
size={ICON_SIZE_BUTTON}
color="black"
/>
}
onPress={() => {
router.push(`/admin/collaboration/${item?.id}/publish`);
}}
/>
}
value2={
<TextCustom align="center" truncate={1}>
{item?.Author?.username || "-"}{" "}
</TextCustom>
}
value3={
<TextCustom align="center" truncate={2}>
{item?.title || "-"}
</TextCustom>
}
/>
<View key={index}>
<AdminTableValue
value1={
<ActionIcon
icon={
<Octicons
name="eye"
size={ICON_SIZE_BUTTON}
color="black"
/>
}
onPress={() => {
router.push(`/admin/collaboration/${item?.id}/publish`);
}}
/>
}
value2={
<TextCustom align="center" truncate={1}>
{item?.Author?.username || "-"}{" "}
</TextCustom>
}
value3={
<TextCustom align="center" truncate={2}>
{item?.title || "-"}
</TextCustom>
}
/>
</View>
))
)}
</StackCustom>

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

@@ -1,67 +1,99 @@
import {
ActionIcon,
BaseBox,
Spacing,
LoaderCustom,
StackCustom,
TextCustom,
ViewWrapper,
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 { apiAdminCollaboration } from "@/service/api-admin/api-admin-collaboration";
import { Octicons } from "@expo/vector-icons";
import { router } from "expo-router";
import { router, useFocusEffect } from "expo-router";
import _ from "lodash";
import { useCallback, useState } from "react";
import { View } from "react-native";
import { Divider } from "react-native-paper";
export default function AdminCollaborationReject() {
const [list, setList] = useState<any[] | null>(null);
const [loadList, setLoadList] = useState(false);
useFocusEffect(
useCallback(() => {
handlerLoadList();
}, [])
);
const handlerLoadList = async () => {
try {
setLoadList(true);
const response = await apiAdminCollaboration({
category: "reject",
});
if (response.success) {
setList(response.data);
}
} catch (error) {
console.log("[ERROR]", error);
} finally {
setLoadList(false);
}
};
return (
<>
<ViewWrapper headerComponent={<AdminTitlePage title="Collaboration" />}>
<StackCustom gap={"xs"}>
<StackCustom>
<AdminComp_BoxTitle title="Reject" />
<BaseBox>
<AdminTitleTable
title1="Aksi"
title2="Username"
title3="Judul Proyek"
/>
<Spacing height={10} />
<Divider />
<AdminTitleTable
title1="Aksi"
title2="Username"
title3="Judul Proyek"
/>
<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>
{loadList ? (
<LoaderCustom />
) : _.isEmpty(list) ? (
<TextCustom>Belum ada data</TextCustom>
) : (
list?.map((item: any) => (
<View key={item.id}>
<AdminTableValue
key={item?.id}
value1={
<ActionIcon
icon={
<Octicons
name="eye"
size={ICON_SIZE_BUTTON}
color="black"
/>
}
onPress={() => {
router.push(`/admin/collaboration/${item?.id}/reject`);
}}
/>
}
value2={
<TextCustom align="center" truncate={1}>
{item?.Author?.username || "-"}
</TextCustom>
}
value3={
<TextCustom align="center" truncate={2}>
{item?.title || "-"}
</TextCustom>
}
/>
</View>
))
)}
</StackCustom>
</ViewWrapper>
</>

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

@@ -7,10 +7,12 @@ export default function AdminTableValue({
value1,
value2,
value3,
bottomLine = false,
}: {
value1: React.ReactNode;
value2: React.ReactNode;
value3: React.ReactNode;
bottomLine?: boolean;
}) {
return (
<>
@@ -50,7 +52,7 @@ export default function AdminTableValue({
{value3}
</Grid.Col>
</Grid>
<Divider />
{bottomLine && <Divider />}
</View>
</>
);

7
screens/Collaboration/BoxPublishSection.tsx
View File

@@ -15,23 +15,24 @@ function Collaboration_BoxPublishSection({
data: any;
rightComponentAvatar?: React.ReactNode;
}) {
return (
<>
<BoxWithHeaderSection href={href}>
<StackCustom gap={0}>
<AvatarUsernameAndOtherComponent
avatarHref={`/profile/${data?.Author?.id}`}
avatarHref={`/profile/${data?.Author?.Profile?.id}`}
name={data?.Author?.username || "Username"}
rightComponent={rightComponentAvatar}
avatar={data?.Author?.Profile?.imageId}
withBottomLine
/>
<StackCustom>
<StackCustom style={{paddingBlock: 10}}>
<TextCustom truncate size="large" bold align="center">
{data?.title || "-"}
</TextCustom>
<TextCustom truncate={2}>{data?.purpose || "-"}</TextCustom>
{/* <TextCustom truncate={2}>{data?.purpose || "-"}</TextCustom> */}
{/* <TextCustom bold size="small" >
2 Partisipan
</TextCustom> */}

17
service/api-admin/api-admin-collaboration.ts
View File

@@ -31,3 +31,20 @@ export async function apiAdminCollaborationGetById({
throw error;
}
}
export async function apiAdminCollaborationReject({
id,
data,
}: {
id: string;
data: any;
}) {
try {
const response = await apiConfig.put(`/mobile/admin/collaboration/${id}`, {
data: data,
});
return response.data;
} catch (error) {
throw error;
}
}