feat: 프론트 투표 결과

src/app/vote/front-end/result/page.tsx

@@ -0,0 +1,10 @@
+import FrontLeaderVoteResult from '@/components/PartLeaderVote/FrontLeaderVoteResult';
+import React from 'react';
+
+export default function FrontEndVoteResultPage() {
+  return (
+    <>
+      <FrontLeaderVoteResult />
+    </>
+  );
+}

src/components/PartLeaderVote/FrontEndVote.tsx

@@ -1,7 +1,7 @@
 'use client';
-import { candiateList, voteAction } from '@/lib/actions/voteAction';
+import { LeaderVoteAction, candiateList } from '@/lib/actions/voteAction';
 import { useRouter } from 'next/navigation';
-import { MouseEvent, useEffect, useState } from 'react';
+import { useEffect, useState } from 'react';
 
 interface Candidate {
   id: number;
@@ -13,14 +13,14 @@ export default function FrontEndVote() {
   const [candidateList, setCandidateList] = useState<Candidate[]>([]);
   const router = useRouter();
 
-  const onClickVote = async (teamId: number) => {
+  const onClickVote = async (memberId: number) => {
     const token = localStorage.getItem('token') || '';
     try {
-      const response = await voteAction(teamId, token);
+      const response = await LeaderVoteAction(memberId, token);
       console.log('투표 결과:', response);
       if (response.ok) {
         alert('투표가 완료되었습니다.');
-        router.push('/front-end-vote/result');
+        router.push('/vote/front-end/result');
       }
     } catch (error) {
       console.error('투표 중 오류가 발생했습니다:', error);
@@ -33,7 +33,6 @@ export default function FrontEndVote() {
       try {
         const response = await candiateList(accessToken);
 
-        // Assuming the response has a `data` key that contains the array of candidates
         const candidates = response.members || [];
 
         if (Array.isArray(candidates)) {
@@ -57,7 +56,7 @@ export default function FrontEndVote() {
         <h1 className="mb-8 text-center text-3xl font-bold">프론트 파트장 투표</h1>
         <div className="flex gap-12">
           <div className="flex flex-wrap justify-center gap-6 px-10">
-            {candidateList.map((data) => (
+            {candidateList.map((data, index) => (
               <div
                 key={data.id}
                 onClick={() => onClickVote(data.id)}

src/components/PartLeaderVote/FrontLeaderVoteResult.tsx

@@ -0,0 +1,67 @@
+'use client';
+
+import { candiateList } from '@/lib/actions/voteAction';
+import { useEffect, useState } from 'react';
+
+interface Candidate {
+  id: number;
+  name: string;
+  part: string;
+  voteCount: number;
+}
+
+export default function FrontLeaderVoteResult() {
+  const [candidateList, setCandidateList] = useState<Candidate[]>([]);
+
+  useEffect(() => {
+    const fetchVoteResult = async () => {
+      const accessToken = localStorage.getItem('token') || '';
+      try {
+        const response = await candiateList(accessToken);
+
+        const candidates = response.members || [];
+
+        if (Array.isArray(candidates)) {
+          // Sort candidates by voteCount in descending order
+          const sortedCandidates = candidates.sort((a: Candidate, b: Candidate) => b.voteCount - a.voteCount);
+          // Select candidates with index 0 to 9
+          const filteredCandidates = sortedCandidates.slice(0, 10);
+          setCandidateList(filteredCandidates);
+          console.log('Candidates:', filteredCandidates);
+        } else {
+          console.error('Expected an array of candidates');
+        }
+      } catch (error) {
+        console.error('투표 결과 조회 중 오류 발생', error);
+      }
+    };
+    fetchVoteResult();
+  }, []);
+
+  return (
+    <div className="flex w-full flex-col items-center justify-center bg-BG-black text-white">
+      <main className="flex w-full flex-grow flex-col items-center justify-center px-12 pb-20">
+        <h1 className="mb-8 pt-12 text-center text-3xl font-bold">FE 파트장 투표 현황</h1>
+
+        <div className="flex w-full gap-12">
+          <div className="flex w-full flex-col gap-6">
+            {candidateList?.map((result, index) => (
+              <div
+                key={result.id}
+                className={`flex w-full cursor-pointer items-center justify-between rounded-lg border-2 border-main px-6 py-3 text-center hover:bg-main active:bg-main ${index === 0 ? 'bg-main' : ''}`}>
+                <div className="flex items-center gap-6">
+                  <div className="rounded-lg bg-white">
+                    <p className="px-3 text-xl font-semibold text-BG-black">{index + 1}</p>
+                  </div>
+                  <p className="text-2xl font-semibold">{result.name}</p>
+                  {/* <p className="text-xs text-gray-200">{result.part}</p> */}
+                </div>
+                <div className="flex items-center text-2xl">{result.voteCount}</div>
+              </div>
+            ))}
+          </div>
+        </div>
+      </main>
+    </div>
+  );
+}

src/lib/actions/voteAction.ts

@@ -12,6 +12,20 @@ export const voteAction = async (teamId: number, token: string) => {
   return response;
 };
 
+export const LeaderVoteAction = async (memberId: number, token: string) => {
+  const response = await fetch(`http://43.201.123.205:8080/votes/leader/${memberId}`, {
+    method: 'POST',
+    headers: {
+      'Content-Type': 'application/json',
+      Access: `Bearer ${token}`,
+    },
+    body: JSON.stringify({
+      memberId,
+    }),
+  });
+  return response;
+};
+
 export const voteResult = async (token: string) => {
   const response = await fetch(`http://43.201.123.205:8080/votes/teams`, {
     method: 'GET',