fix admin voting

- fix detail publish voting

src/app_modules/admin/vote/child/table_publish/index.tsx

@@ -22,13 +22,10 @@ import {
   Stack,
   Table,
   Text,
-  TextInput
+  TextInput,
 } from "@mantine/core";
 import { useDisclosure, useShallowEffect } from "@mantine/hooks";
-import {
-  IconCircleCheckFilled,
-  IconSearch
-} from "@tabler/icons-react";
+import { IconCircleCheckFilled, IconSearch } from "@tabler/icons-react";
 import _ from "lodash";
 import { useRouter } from "next/navigation";
 import { useState } from "react";
@@ -36,6 +33,8 @@ import ComponentAdminVote_DetailHasil from "../../component/detail_hasil";
 import { AdminVote_getHasilById } from "../../fun/get/get_hasil_by_id";
 import { AdminVote_getListKontributorById } from "../../fun/get/get_list_kontributor_by_id";
 import { apiGetAdminVotingByStatus } from "../../lib/api_fetch_admin_voting";
+import Admin_DetailButton from "@/app_modules/admin/_admin_global/_component/button/detail_button";
+import { RouterAdminVote } from "@/lib/router_admin/router_admin_vote";
 
 export default function AdminVote_TablePublish() {
   return (
@@ -109,54 +108,13 @@ function TableStatus() {
 
     return data?.map((e, i) => (
       <tr key={i}>
-        <td>
-          <Center>
-            <Button
-              loading={
-                e?.id === voteId ? (loading === true ? true : false) : false
-              }
-              radius={"xl"}
-              color="green"
-              leftIcon={<IconCircleCheckFilled />}
-              onClick={async () => {
-                setVoteId(e?.id);
-                setLoading(true);
-                await new Promise((r) => setTimeout(r, 500));
-                onList(e?.id, setHasil, setKontributor, setLoading, open);
-              }}
-            >
-              Lihat Hasil
-            </Button>
-          </Center>
-        </td>
         <td>
           <Center c={AccentColor.white}>{e?.Author?.username}</Center>
         </td>
         <td>
           <Center c={AccentColor.white}>{e?.title}</Center>
         </td>
-        <td>
-          <Center c={"white"}>
-            <Spoiler
-              hideLabel="sembunyikan"
-              maw={400}
-              maxHeight={50}
-              showLabel="tampilkan"
-            >
-              {e?.deskripsi}
-            </Spoiler>
-          </Center>
-        </td>
-        <td>
-          <Stack>
-            {e?.Voting_DaftarNamaVote.map((v) => (
-              <Box key={v?.id}>
-                <Text c={AccentColor.white}>- {v?.value}</Text>
-              </Box>
-            ))}
-          </Stack>
-        </td>
-
+  
         <td>
           <Center c={AccentColor.white}>
             {new Intl.DateTimeFormat("id-ID", {
@@ -171,7 +129,12 @@ function TableStatus() {
             }).format(new Date(e?.akhirVote))}
           </Center>
         </td>
-        
+
+        <td>
+          <Center>
+            <Admin_DetailButton path={RouterAdminVote.detail({id: e.id})} />
+          </Center>
+        </td>
       </tr>
     ));
   };
@@ -201,35 +164,24 @@ function TableStatus() {
         ) : (
           <Paper p={"md"} bg={AdminColor.softBlue} shadow="lg" h={"80vh"}>
             <ScrollArea w={"100%"} h={"90%"}>
-              <Table
-                verticalSpacing={"md"}
-                horizontalSpacing={"md"}
-                p={"md"}
-                w={1500}
-              >
+              <Table verticalSpacing={"md"} horizontalSpacing={"md"} p={"md"}>
                 <thead>
                   <tr>
-                    <th>
-                      <Center c={AccentColor.white}>Aksi</Center>
-                    </th>
                     <th>
                       <Center c={AccentColor.white}>Username</Center>
                     </th>
                     <th>
                       <Center c={AccentColor.white}>Judul</Center>
                     </th>
-                    <th>
-                      <Center c={AccentColor.white}>Deskripsi</Center>
-                    </th>
-                    <th>
-                      <Center c={AccentColor.white}>Pilihan</Center>
-                    </th>
                     <th>
                       <Center c={AccentColor.white}>Mulai Vote</Center>
                     </th>
                     <th>
                       <Center c={AccentColor.white}>Selesai Vote</Center>
                     </th>
+                    <th>
+                      <Center c={AccentColor.white}>Aksi</Center>
+                    </th>
                   </tr>
                 </thead>
                 <tbody>{renderTableBody()}</tbody>

src/app_modules/admin/vote/component/comp_kontributor.tsx

@@ -0,0 +1,123 @@
+import CustomSkeleton from "@/app_modules/components/CustomSkeleton";
+import {
+  MODEL_VOTE_KONTRIBUTOR,
+  MODEL_VOTING_DAFTAR_NAMA_VOTE,
+} from "@/app_modules/vote/model/interface";
+import {
+  Badge,
+  Box,
+  Center,
+  Divider,
+  Grid,
+  Paper,
+  ScrollArea,
+  Stack,
+  Text,
+  Title
+} from "@mantine/core";
+import { useShallowEffect } from "@mantine/hooks";
+import _ from "lodash";
+import { useParams } from "next/navigation";
+import { useState } from "react";
+import { Admin_ComponentBoxStyle } from "../../_admin_global/_component/comp_admin_boxstyle";
+import { apiGetAdminKontibutorVotingById } from "../lib/api_fetch_admin_voting";
+
+interface Props {
+  dataHasil: MODEL_VOTING_DAFTAR_NAMA_VOTE[];
+}
+export function AdminVoting_ComponentKontributorList({ dataHasil }: Props) {
+  const param = useParams<{ id: string }>();
+  const [data, setData] = useState<MODEL_VOTE_KONTRIBUTOR[] | null>(null);
+
+  useShallowEffect(() => {
+    handleLoadData();
+  }, []);
+
+  async function handleLoadData() {
+    try {
+      const response = await apiGetAdminKontibutorVotingById({ id: param.id });
+
+      if (response && response.success) {
+        setData(response.data);
+      } else {
+        setData(null);
+      }
+    } catch (error) {
+      console.log("Error get list data kontributor voting admin", error);
+    }
+  }
+
+  return (
+    <>
+      <Admin_ComponentBoxStyle style={{ height: 700 }}>
+        <Stack>
+          <Title align="center" order={5}>
+            Hasil Kontributor
+          </Title>
+
+          <Grid justify="center">
+            {dataHasil?.map((e: MODEL_VOTING_DAFTAR_NAMA_VOTE, i) => (
+              <Grid.Col span={3} key={i}>
+                <Stack p={"md"} align="center">
+                  <Paper withBorder p={"xl"}>
+                    <Text fz={30}>{e.jumlah}</Text>
+                  </Paper>
+                  <Text lineClamp={2} fz={"sm"}>
+                    {e.value}
+                  </Text>
+                </Stack>
+              </Grid.Col>
+            ))}
+          </Grid>
+
+          {!data ? (
+            <CustomSkeleton height={100} />
+          ) : _.isEmpty(data) ? (
+            <Center>
+              <Text fz={"xs"} fw={"bold"}>
+                - Tidak ada voting -
+              </Text>
+            </Center>
+          ) : (
+            <Box h={450} px={"sm"}>
+              <ScrollArea h={430} w={"100%"} p={"sm"}>
+                <Stack p={"sm"}>
+                  {data?.map((e, i) => (
+                    <Stack spacing={"xs"} key={i}>
+                      <Grid>
+                        <Grid.Col span={5}>
+                          <Stack justify="center" h={"100%"}>
+                            <Text truncate fz={"sm"} fw={"bold"}>
+                              {e ? e?.Author?.username : "Nama kontributor"}
+                            </Text>
+                          </Stack>
+                        </Grid.Col>
+                        <Grid.Col span={5}>
+                          <Center>
+                            <Badge>
+                              <Text
+                                truncate
+                                fz={
+                                  e.Voting_DaftarNamaVote.value.length > 10
+                                    ? 8
+                                    : 10
+                                }
+                              >
+                                {e.Voting_DaftarNamaVote.value}
+                              </Text>
+                            </Badge>
+                          </Center>
+                        </Grid.Col>
+                      </Grid>
+                      <Divider />
+                    </Stack>
+                  ))}
+                </Stack>
+              </ScrollArea>
+            </Box>
+          )}
+        </Stack>
+      </Admin_ComponentBoxStyle>
+    </>
+  );
+}

src/app_modules/admin/vote/component/comp_publish.tsx

@@ -0,0 +1,22 @@
+"use client";
+
+import { SimpleGrid, Title } from "@mantine/core";
+import { Admin_ComponentBoxStyle } from "../../_admin_global/_component/comp_admin_boxstyle";
+import { AdminVoting_ComponentDetail } from "./detail";
+import { MODEL_VOTING } from "@/app_modules/vote/model/interface";
+import { AdminVoting_ComponentKontributorList } from "./comp_kontributor";
+
+interface Props {
+  data: MODEL_VOTING;
+}
+export function AdminVoting_ComponentDetailPublish({ data }: Props) {
+
+  return (
+    <SimpleGrid cols={2}>
+      <Admin_ComponentBoxStyle style={{height: 700}}>
+        <AdminVoting_ComponentDetail data={data} />
+      </Admin_ComponentBoxStyle>
+      <AdminVoting_ComponentKontributorList dataHasil={data.Voting_DaftarNamaVote}/>
+    </SimpleGrid>
+  );
+}

src/app_modules/admin/vote/component/detail.tsx

@@ -0,0 +1,74 @@
+"use client";
+
+import { MODEL_VOTING } from "@/app_modules/vote/model/interface";
+import { Badge, Grid, Stack, Text, Title } from "@mantine/core";
+import moment from "moment";
+
+interface Props {
+  data: MODEL_VOTING;
+}
+
+export function AdminVoting_ComponentDetail({ data }: Props) {
+  const listData = [
+    {
+      title: "Username",
+      value: data.Author.username,
+    },
+    {
+      title: "Judul",
+      value: data.title,
+    },
+    {
+      title: "Deskripsi",
+      value: data.deskripsi,
+    },
+    {
+      title: "Awal voting",
+      value: moment(data.awalVote).format("DD-MM-YYYY"),
+    },
+    {
+      title: "Akhir voting",
+      value: moment(data.akhirVote).format("DD-MM-YYYY"),
+    },
+    {
+      title: "Status",
+      value: <Badge variant="light">{data.Voting_Status.name}</Badge>,
+    },
+  ];
+
+  return (
+    <>
+      <Stack>
+        {listData.map((item, index) => (
+          <Grid key={index}>
+            <Grid.Col span={3}>
+              <Text>{item.title}</Text>
+            </Grid.Col>
+            <Grid.Col span={1}>
+              <Text>:</Text>
+            </Grid.Col>
+            <Grid.Col span={"auto"}>
+              <Text>{item.value}</Text>
+            </Grid.Col>
+          </Grid>
+        ))}
+
+        <Grid>
+          <Grid.Col span={3}>
+            <Text>Daftar Pilihan</Text>
+          </Grid.Col>
+          <Grid.Col span={1}>
+            <Text>:</Text>
+          </Grid.Col>
+          <Grid.Col span={"auto"}>
+            <Stack>
+              {data.Voting_DaftarNamaVote.map((e, i) => (
+                <Text key={i}>- {e.value}</Text>
+              ))}
+            </Stack>
+          </Grid.Col>
+        </Grid>
+      </Stack>
+    </>
+  );
+}

src/app_modules/admin/vote/detail/detail_voting.tsx

@@ -0,0 +1,64 @@
+"use client";
+
+import CustomSkeleton from "@/app_modules/components/CustomSkeleton";
+import { MODEL_VOTING } from "@/app_modules/vote/model/interface";
+import { SimpleGrid, Stack } from "@mantine/core";
+import { useShallowEffect } from "@mantine/hooks";
+import { useParams } from "next/navigation";
+import { useState } from "react";
+import AdminGlobal_ComponentBackButton from "../../_admin_global/back_button";
+import ComponentAdminGlobal_HeaderTamplate from "../../_admin_global/header_tamplate";
+import { AdminVoting_ComponentDetailPublish } from "../component/comp_publish";
+import { apiGetOneVotingById } from "../lib/api_fetch_admin_voting";
+
+export function AdminVote_DetailVoting() {
+  const param = useParams<{ id: string }>();
+  const [data, setData] = useState<MODEL_VOTING | null>();
+
+  useShallowEffect(() => {
+    handleLoadData();
+  }, []);
+
+  const handleLoadData = async () => {
+    try {
+      const response = await apiGetOneVotingById({
+        id: param.id,
+      });
+
+      if (response) {
+        setData(response.data);
+      } else {
+        setData(null);
+      }
+    } catch (error) {
+      console.log("Error get one data voting admin", error);
+    }
+  };
+
+  return (
+    <>
+      <Stack>
+        <ComponentAdminGlobal_HeaderTamplate name="Detail voting" />
+        <AdminGlobal_ComponentBackButton />
+
+        {data === undefined && (
+          <SimpleGrid cols={2}>
+            <CustomSkeleton height={500} />
+          </SimpleGrid>
+        )}
+
+        {data && data.voting_StatusId === "1" ? (
+          <AdminVoting_ComponentDetailPublish data={data} />
+        ) : data && data.voting_StatusId === "2" ? (
+          "detail review"
+        ) : data && data.voting_StatusId === "4" ? (
+          "detail reject"
+        ) : (
+          ""
+        )}
+
+        {/* <pre style={{ color: "white" }}>{JSON.stringify(data, null, 2)}</pre> */}
+      </Stack>
+    </>
+  );
+}

src/app_modules/admin/vote/lib/api_fetch_admin_voting.ts

@@ -3,6 +3,8 @@ export {
   apiGetAdminVoteRiwayatCount,
   apiGetAdminVotingByStatus,
   apiGetAdminVotingRiwayat,
+  apiGetOneAdminVotingById as apiGetOneVotingById,
+  apiGetAdminKontibutorVotingById,
 };
 const apiGetAdminVoteStatusCountDashboard = async ({
   name,
@@ -87,7 +89,6 @@ const apiGetAdminVotingByStatus = async ({
   }
 };
 
-
 const apiGetAdminVotingRiwayat = async ({
   page,
   search,
@@ -133,3 +134,68 @@ const apiGetAdminVotingRiwayat = async ({
   }
 };
 
+const apiGetOneAdminVotingById = async ({ id }: { id: string }) => {
+  try {
+    const { token } = await fetch("/api/get-cookie").then((res) => res.json());
+    if (!token) {
+      console.error("No token found");
+      return null;
+    }
+
+    const response = await fetch(`/api/admin/vote/${id}`, {
+      headers: {
+        "Content-Type": "application/json",
+        Accept: "application/json",
+        Authorization: `Bearer ${token}`,
+      },
+    });
+
+    // Check if the response is OK
+    if (!response.ok) {
+      const errorData = await response.json().catch(() => null);
+      console.error(
+        "Error get one data voting admin",
+        errorData?.message || "Unknown error"
+      );
+      return null;
+    }
+
+    return response.json();
+  } catch (error) {
+    console.log("Error get one data voting admin", error);
+    throw error;
+  }
+};
+
+const apiGetAdminKontibutorVotingById = async ({ id }: { id: string }) => {
+  try {
+    const { token } = await fetch("/api/get-cookie").then((res) => res.json());
+    if (!token) {
+      console.error("No token found");
+      return null;
+    }
+
+    const response = await fetch(`/api/admin/vote/${id}/kontributor`, {
+      headers: {
+        "Content-Type": "application/json",
+        Accept: "application/json",
+        Authorization: `Bearer ${token}`,
+      },
+    });
+
+    // Check if the response is OK
+    if (!response.ok) {
+      const errorData = await response.json().catch(() => null);
+      console.error(
+        "Error get one data voting admin",
+        errorData?.message || "Unknown error"
+      );
+      return null;
+    }
+
+    return response.json();
+  } catch (error) {
+    console.log("Error get one data voting admin", error);
+    throw error;
+  }
+};