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

Admin Voting

Browse Source 
Add:
- admin/voting: tambah [id] dan [status]

Component Admin
Add:
- components/_ShareComponent/Admin/ButtonReject
- components/_ShareComponent/Admin/ButtonReview

### No Issue
This commit is contained in:
Bagasbanuna02
2025-08-12 11:27:17 +08:00
parent 72f760c6a9
commit 21f89aeec5
9 changed files with 428 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -86,10 +86,16 @@ export default function AdminLayout() {
<Stack.Screen name="forum/[id]/index" />
<Stack.Screen name="forum/report-comment"/>
<Stack.Screen name="forum/report-posting"/>
<Stack.Screen name="forum/[id]/list-report-posting" />
<Stack.Screen name="forum/[id]/list-report-comment"/>
{/* ================== Forum End ================== */}
{/* ================== Voting Start ================== */}
<Stack.Screen name="voting/index" />
<Stack.Screen name="voting/[status]/status" />
<Stack.Screen name="voting/[id]/[status]/index" />
<Stack.Screen name="voting/[id]/reject-input"/>
{/* ================== Voting End ================== */}
</Stack>
<DrawerAdmin

173
app/(application)/admin/voting/[id]/[status]/index.tsx Normal file
View File

@@ -0,0 +1,173 @@
import {
AlertDefaultSystem,
BadgeCustom,
BaseBox,
CircleContainer,
Grid,
Spacing,
StackCustom,
TextCustom,
ViewWrapper,
} from "@/components";
import AdminBackButtonAntTitle from "@/components/_ShareComponent/Admin/BackButtonAntTitle";
import AdminButtonReject from "@/components/_ShareComponent/Admin/ButtonReject";
import AdminButtonReview from "@/components/_ShareComponent/Admin/ButtonReview";
import { GridDetail_4_8 } from "@/components/_ShareComponent/GridDetail_4_8";
import { MainColor } from "@/constants/color-palet";
import dayjs from "dayjs";
import { router, useLocalSearchParams } from "expo-router";
import _ from "lodash";
import { List } from "react-native-paper";
export default function AdminVotingDetail() {
const { id, status } = useLocalSearchParams();
const colorBadge = () => {
if (status === "publish") {
return MainColor.green;
} else if (status === "review") {
return MainColor.orange;
} else if (status === "reject") {
return MainColor.red;
} else {
return MainColor.placeholder;
}
};
const listData = [
{
label: "Username",
value: "Bagas Banuna",
},
{
label: "Judul",
value: `Judul Proyek: ${id}Lorem ipsum dolor sit amet consectetur adipisicing elit.`,
},
{
label: "Status",
value: (
<BadgeCustom color={colorBadge()}>
{_.startCase(status as string)}
</BadgeCustom>
),
},
{
label: "Mulai Voting",
value: dayjs().format("DD/MM/YYYY"),
},
{
label: "Voting Berakhir",
value: dayjs().format("DD/MM/YYYY"),
},
{
label: "Deskripsi",
value: "Lorem ipsum dolor sit amet consectetur adipisicing elit.",
},
{
label: "Daftar Pilhan",
value: (
<>
<List.Item
title={<TextCustom>Pilihan 1</TextCustom>}
left={(props) => (
<List.Icon {...props} icon="circle" color={MainColor.yellow} />
)}
/>
<List.Item
title={<TextCustom>Pilihan 2</TextCustom>}
left={(props) => (
<List.Icon {...props} icon="circle" color={MainColor.yellow} />
)}
/>
<List.Item
title={<TextCustom>Pilihan 3</TextCustom>}
left={(props) => (
<List.Icon {...props} icon="circle" color={MainColor.yellow} />
)}
/>
<List.Item
title={<TextCustom>Pilihan 4</TextCustom>}
left={(props) => (
<List.Icon {...props} icon="circle" color={MainColor.yellow} />
)}
/>
</>
),
},
];
return (
<>
<ViewWrapper
headerComponent={<AdminBackButtonAntTitle title={`Detail Data`} />}
>
<BaseBox>
<StackCustom>
{listData.map((item, i) => (
<GridDetail_4_8
key={i}
label={<TextCustom bold>{item.label}</TextCustom>}
value={<TextCustom>{item.value}</TextCustom>}
/>
))}
</StackCustom>
</BaseBox>
{status === "publish" && (
<BaseBox>
<TextCustom bold align="center">
Hasil Voting
</TextCustom>
<Spacing />
<Grid>
{Array.from({length: 4}).map((_, index) => (
<Grid.Col key={index} span={3} style={{ paddingRight: 3, paddingLeft: 3 }}>
<StackCustom gap={"sm"}>
<CircleContainer value={index % 3 * 3} style={{ alignSelf: "center" }} />
<TextCustom size="small" align="center">
Pilihan {index + 1}
</TextCustom>
</StackCustom>
</Grid.Col>
))}
</Grid>
</BaseBox>
)}
{status === "review" && (
<AdminButtonReview
onPublish={() => {
AlertDefaultSystem({
title: "Publish",
message: "Apakah anda yakin ingin mempublikasikan data ini?",
textLeft: "Cancel",
textRight: "Publish",
onPressLeft: () => {
router.back();
},
onPressRight: () => {
router.back();
},
});
}}
onReject={() => {
router.push(`/admin/voting/${id}/reject-input`);
}}
/>
)}
{status === "reject" && (
<AdminButtonReject
title="Tambah Catatan"
onReject={() => {
router.push(`/admin/voting/${id}/reject-input`);
}}
/>
)}
<Spacing />
</ViewWrapper>
</>
);
}

55
app/(application)/admin/voting/[id]/reject-input.tsx Normal file
View File

@@ -0,0 +1,55 @@
import {
AlertDefaultSystem,
BoxButtonOnFooter,
TextAreaCustom,
ViewWrapper,
} from "@/components";
import AdminBackButtonAntTitle from "@/components/_ShareComponent/Admin/BackButtonAntTitle";
import AdminButtonReject from "@/components/_ShareComponent/Admin/ButtonReject";
import { router, useLocalSearchParams } from "expo-router";
import { useState } from "react";
export default function AdminVotingRejectInput() {
const { id } = useLocalSearchParams();
const [value, setValue] = useState(id as string);
const buttonSubmit = (
<BoxButtonOnFooter>
<AdminButtonReject
title="Reject"
onReject={() =>
AlertDefaultSystem({
title: "Reject",
message: "Apakah anda yakin ingin menolak data ini?",
textLeft: "Batal",
textRight: "Ya",
onPressLeft: () => {
router.back();
},
onPressRight: () => {
console.log("value:", value);
router.replace(`/admin/voting/reject/status`);
},
})
}
/>
</BoxButtonOnFooter>
);
return (
<>
<ViewWrapper
footerComponent={buttonSubmit}
headerComponent={<AdminBackButtonAntTitle title="Masukan Alasan" />}
>
<TextAreaCustom
value={value}
onChangeText={setValue}
placeholder="Masukan alasan"
required
showCount
maxLength={1000}
/>
</ViewWrapper>
</>
);
}

76
app/(application)/admin/voting/[status]/status.tsx Normal file
View File

@@ -0,0 +1,76 @@
import {
ActionIcon,
BaseBox,
SearchInput,
Spacing,
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, useLocalSearchParams } from "expo-router";
import _ from "lodash";
import { Divider } from "react-native-paper";
export default function AdminVotingStatus() {
const { status } = useLocalSearchParams();
const rightComponent = (
<SearchInput
containerStyle={{ width: "100%", marginBottom: 0 }}
placeholder="Cari"
/>
);
return (
<>
<ViewWrapper headerComponent={<AdminTitlePage title="Voting" />}>
<AdminComp_BoxTitle
title={`${_.startCase(status as string)}`}
rightComponent={rightComponent}
/>
<BaseBox>
<AdminTitleTable
title1="Aksi"
title2="Username"
title3="Judul Voting"
/>
<Spacing />
<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/voting/${index}/${status}`);
}}
/>
}
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>
</ViewWrapper>
</>
);
}

49
app/(application)/admin/voting/index.tsx Normal file
View File

@@ -0,0 +1,49 @@
import { Spacing, StackCustom, ViewWrapper } from "@/components";
import { IconArchive } from "@/components/_Icon";
import {
IconPublish,
IconReject,
IconReview,
} from "@/components/_Icon/IconComponent";
import AdminComp_BoxDashboard from "@/components/_ShareComponent/Admin/BoxDashboard";
import AdminTitlePage from "@/components/_ShareComponent/Admin/TitlePage";
import { MainColor } from "@/constants/color-palet";
export default function AdminVoting() {
return (
<>
<ViewWrapper>
<AdminTitlePage title="Voting" />
<Spacing />
<StackCustom gap={"xs"}>
{listData.map((item, i) => (
<AdminComp_BoxDashboard key={i} item={item} />
))}
</StackCustom>
</ViewWrapper>
</>
);
}
const listData = [
{
label: "Publish",
value: 4,
icon: <IconPublish size={25} color={MainColor.green} />,
},
{
label: "Review",
value: 7,
icon: <IconReview size={25} color={MainColor.orange} />,
},
{
label: "Reject",
value: 5,
icon: <IconReject size={25} color={MainColor.red} />,
},
{
label: "Riwayat",
value: 5,
icon: <IconArchive size={25} color={MainColor.white_gray} />,
},
];

24
components/_ShareComponent/Admin/ButtonReject.tsx Normal file
View File

@@ -0,0 +1,24 @@
import { IconReject } from "@/components/_Icon/IconComponent";
import ButtonCustom from "@/components/Button/ButtonCustom";
import { MainColor } from "@/constants/color-palet";
export default function AdminButtonReject({
title,
onReject,
}: {
title: string;
onReject: () => void;
}) {
return (
<>
<ButtonCustom
iconLeft={<IconReject />}
backgroundColor={MainColor.red}
textColor="white"
onPress={onReject}
>
{title}
</ButtonCustom>
</>
);
}

39
components/_ShareComponent/Admin/ButtonReview.tsx Normal file
View File

@@ -0,0 +1,39 @@
import { IconPublish, IconReject } from "@/components/_Icon/IconComponent";
import ButtonCustom from "@/components/Button/ButtonCustom";
import Grid from "@/components/Grid/GridCustom";
import { MainColor } from "@/constants/color-palet";
export default function AdminButtonReview({
onPublish,
onReject,
}: {
onPublish: () => void;
onReject: () => void;
}) {
return (
<>
<Grid>
<Grid.Col span={6} style={{ paddingRight: 10 }}>
<ButtonCustom
iconLeft={<IconPublish />}
backgroundColor={MainColor.green}
textColor="white"
onPress={onPublish}
>
Publish
</ButtonCustom>
</Grid.Col>
<Grid.Col span={6} style={{ paddingLeft: 10 }}>
<ButtonCustom
iconLeft={<IconReject />}
backgroundColor={MainColor.red}
textColor="white"
onPress={onReject}
>
Reject
</ButtonCustom>
</Grid.Col>
</Grid>
</>
);
}

8
screens/Admin/listPageAdmin.tsx
View File

@@ -46,10 +46,10 @@ const adminListMenu: NavbarItem[] = [
icon: "accessibility-outline",
links: [
{ label: "Dashboard", link: "/admin/voting" },
{ label: "Publish", link: "/admin/voting/publish" },
{ label: "Review", link: "/admin/voting/review" },
{ label: "Reject", link: "/admin/voting/reject" },
{ label: "Riwayat", link: "/admin/voting/riwayat" },
{ label: "Publish", link: "/admin/voting/publish/status" },
{ label: "Review", link: "/admin/voting/review/status" },
{ label: "Reject", link: "/admin/voting/reject/status" },
{ label: "Riwayat", link: "/admin/voting/riwayat/status" },
],
},
{

2
screens/Authentication/LoginView.tsx
View File

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