CEOS-Developers · Rose-my · May 23, 2024 · May 23, 2024 · May 23, 2024 · May 23, 2024
diff --git a/.github/ISSUE_TEMPLATE/template-issue.md b/.github/ISSUE_TEMPLATE/template-issue.md
@@ -0,0 +1,18 @@
+---
+name: template-issue
+about: 이슈 템플릿
+title: 'design: 투표페이지 뷰'
+labels: ''
+assignees: ''
+
+---
+
+## 목적
+
+설명
+
+## 작업 상세 내용
+
+- [ ] todo1
+- [ ] todo2
+- [ ] todo3
diff --git a/.github/pull_request_template.md b/.github/pull_request_template.md
@@ -0,0 +1,22 @@
+## Related Issues
+
+- close #issue_number
+
+## PR 유형
+
+어떤 변경 사항이 있나요?
+
+- [ ] 새로운 기능 추가
+- [ ] 오류 수정
+- [ ] CSS 등 스타일 변경 
+- [ ] 코드에 영향을 주지 않는 변경사항(오타 수정, 탭 사이즈 변경, 변수명 변경)
+- [ ] 코드 리팩토링 
+- [ ] 주석 추가 및 수정
+- [ ] 문서 수정
+- [ ] 테스트 추가, 테스트 리팩토링
+- [ ] 파일 혹은 폴더 삭제
+
+## 변경 사항 in Detail
+
+- [ ] 변경 사항
+  - 변경 사항 상세 설명
diff --git a/vote/.eslintrc.cjs b/vote/.eslintrc.cjs
@@ -0,0 +1,21 @@
+module.exports = {
+  root: true,
+  env: { browser: true, es2020: true },
+  extends: [
+    "eslint:recommended",
+    "plugin:@typescript-eslint/recommended",
+    "plugin:react-hooks/recommended",
+    "some-other-config-you-use",
+    "prettier",
+  ],
+  ignorePatterns: ["dist", ".eslintrc.cjs"],
+  parser: "@typescript-eslint/parser",
+  plugins: ["prettier"],
+  rules: {
+    "prettier/prettier": "error",
+  },
+  // plugins: ["react-refresh"],
+  // rules: {
+  //   "react-refresh/only-export-components": ["warn", { allowConstantExport: true }],
+  // },
+};
diff --git a/vote/.gitignore b/vote/.gitignore
@@ -0,0 +1,26 @@
+# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+pnpm-debug.log*
+lerna-debug.log*
+
+node_modules
+dist
+dist-ssr
+*.local
+
+# Editor directories and files
+.vscode/*
+!.vscode/extensions.json
+.idea
+.DS_Store
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw?
+
+.env
diff --git a/vote/.prettierrc b/vote/.prettierrc
@@ -0,0 +1,8 @@
+{
+  "semi": true,
+  "tabWidth": 2,
+  "printWidth": 80,
+  "trailingComma": "all",
+  "bracketSameLine": true,
+  "endOfLine": "auto"
+}
diff --git a/vote/README.md b/vote/README.md
@@ -0,0 +1,9 @@
+# Vite로 React 실행하기
+
+cd vote // Directory 이동
+
+code . // 해당 디렉토리를 최상위로 VSCode 실행
+
+yarn // 의존성 모듈 설치
+
+yarn dev // React 앱 실행
diff --git a/vote/index.html b/vote/index.html
@@ -0,0 +1,21 @@
+<!doctype html>
+<html lang="ko">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>리액트 투표페이지</title>
+    <link
+      rel="icon"
+      href="/src/assets/image/favicon.png"
+      type="image/svg+xml" />
+    <link rel="preconnect" href="https://fonts.googleapis.com" />
+    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
+    <link
+      href="https://fonts.googleapis.com/css2?family=Inter:[email protected]&display=swap"
+      rel="stylesheet" />
+  </head>
+  <body>
+    <div id="root"></div>
+    <script type="module" src="/src/main.tsx"></script>
+  </body>
+</html>
diff --git a/vote/package.json b/vote/package.json
@@ -0,0 +1,42 @@
+{
+  "name": "vote",
+  "private": true,
+  "version": "0.0.0",
+  "type": "module",
+  "scripts": {
+    "dev": "vite",
+    "build": "tsc && vite build",
+    "lint": "eslint . --ext ts,tsx --report-unused-disable-directives --max-warnings 0",
+    "preview": "vite preview"
+  },
+  "dependencies": {
+    "@types/react-router-dom": "^5.3.3",
+    "axios": "^1.7.2",
+    "react": "^18.2.0",
+    "react-cookie": "^7.1.4",
+    "react-dom": "^18.2.0",
+    "react-query": "^3.39.3",
+    "react-router-dom": "^6.23.1",
+    "styled-components": "^6.1.11",
+    "styled-reset": "^4.5.2"
+  },
+  "devDependencies": {
+    "@types/node": "^20.12.12",
+    "@types/react": "^18.2.66",
+    "@types/react-dom": "^18.2.22",
+    "@types/styled-components": "^5.1.34",
+    "@typescript-eslint/eslint-plugin": "^7.2.0",
+    "@typescript-eslint/parser": "^7.2.0",
+    "@vitejs/plugin-react": "^4.2.1",
+    "eslint": "^8.57.0",
+    "eslint-config-prettier": "^9.1.0",
+    "eslint-plugin-prettier": "^5.1.3",
+    "eslint-plugin-react-hooks": "^4.6.0",
+    "eslint-plugin-react-refresh": "^0.4.6",
+    "prettier": "^3.2.5",
+    "typescript": "^5.2.2",
+    "vite": "^5.2.0",
+    "vite-plugin-svgr": "^4.2.0",
+    "vite-tsconfig-paths": "^4.3.2"
+  }
+}
diff --git a/vote/public/vite.svg b/vote/public/vite.svg
diff --git a/vote/src/App.tsx b/vote/src/App.tsx
@@ -0,0 +1,24 @@
+import { Suspense } from "react";
+import { Router } from "router";
+import { RouterProvider } from "react-router-dom";
+import { ThemeProvider } from "styled-components";
+import GlobalStyle from "@styles/globalStyle";
+import theme from "@styles/theme";
+import { QueryClient, QueryClientProvider } from "react-query";
+
+const queryClient = new QueryClient();
+
+function App() {
+  return (
+    <QueryClientProvider client={queryClient}>
+      <Suspense fallback="..loading">
+        <ThemeProvider theme={theme}>
+          <RouterProvider router={Router} />
+          <GlobalStyle />
+        </ThemeProvider>
+      </Suspense>
+    </QueryClientProvider>
+  );
+}
+
+export default App;
diff --git a/vote/src/api/cookie.ts b/vote/src/api/cookie.ts
@@ -0,0 +1,19 @@
+import { Cookies } from "react-cookie";
+
+const cookies = new Cookies();
+
+export function setCookie(
+  name: string,
+  value: string | undefined,
+  options: object,
+) {
+  return cookies.set(name, value, { ...options });
+}
+
+export function getCookie(name: string) {
+  return cookies.get(name);
+}
+
+export function removeCookie(name: string) {
+  return cookies.remove(name);
+}
diff --git a/vote/src/api/customAxios.ts b/vote/src/api/customAxios.ts
@@ -0,0 +1,19 @@
+// import axios from "axios";
+
+// export const customAxios = axios.create({
+//   baseURL: `${import.meta.env.VITE_APP_BASE_URL}`,
+//   headers: {
+//     "Content-Type": "application/json",
+//     "Access-Control-Allow-Origin": "*",
+//   },
+// });
+
+import axios, { AxiosInstance } from "axios";
+
+export const customAxios: AxiosInstance = axios.create({
+  baseURL: `${import.meta.env.VITE_APP_BASE_URL}`,
+  headers: {
+    "Content-Type": "application/json",
+    "Access-Control-Allow-Origin": "*",
+  },
+});
diff --git a/vote/src/api/getFinalResult.ts b/vote/src/api/getFinalResult.ts
@@ -0,0 +1,24 @@
+import { AxiosResponse } from "axios";
+import { customAxios } from "./customAxios";
+
+export interface ResponseTypes {
+  votingOptionCount: number;
+  votingOptionName: string;
+  votingOptionId: number;
+}
+
+interface GetFinalResultTypes {
+  success: boolean;
+  response: ResponseTypes[];
+}
+
+export async function getFinalResult(
+  topicID: number,
+): Promise<ResponseTypes[]> {
+  const { data }: AxiosResponse<GetFinalResultTypes> = await customAxios.get(
+    `/api/topics/${topicID}/results`,
+  );
+
+  const { response } = data;
+  return response;
+}
diff --git a/vote/src/api/getTopicsById.ts b/vote/src/api/getTopicsById.ts
@@ -0,0 +1,28 @@
+import { AxiosResponse } from "axios";
+import { customAxios } from "./customAxios";
+
+export interface VotingOptionDtoTypes {
+  id: number;
+  name: string;
+}
+
+export interface ResponseTypes {
+  id: number;
+  name: string;
+  minimumVotesRequired: number;
+  votingOptionDto: VotingOptionDtoTypes[];
+}
+
+interface GetTopicsByIdTypes {
+  success: boolean;
+  response: ResponseTypes;
+}
+
+export async function getTopicsById(topicID: number): Promise<ResponseTypes> {
+  const { data }: AxiosResponse<GetTopicsByIdTypes> = await customAxios.get(
+    `/api/topics/${topicID}`,
+  );
+
+  const { response } = data;
+  return response;
+}
diff --git a/vote/src/api/getVotingOptionsById.ts b/vote/src/api/getVotingOptionsById.ts
@@ -0,0 +1,23 @@
+import { AxiosResponse } from "axios";
+import { customAxios } from "./customAxios";
+
+export interface ResponseTypes {
+  id: number;
+  name: string;
+  voteCount: number;
+}
+
+interface GetVotingOptionsByIdTypes {
+  success: boolean;
+  response: ResponseTypes[];
+}
+
+export async function getVotingOptionsById(
+  topicID: number,
+): Promise<ResponseTypes[]> {
+  const { data }: AxiosResponse<GetVotingOptionsByIdTypes> =
+    await customAxios.get(`/api/votingoptions/topics/${topicID}`);
+
+  const { response } = data;
+  return response;
+}
diff --git a/vote/src/api/postEmail.ts b/vote/src/api/postEmail.ts
@@ -0,0 +1,11 @@
+import { postEmailTypes } from "types/postEmailTypes";
+import { customAxios } from "./customAxios";
+
+export async function postEmail(props: postEmailTypes) {
+  const { email } = props;
+  const response = await customAxios.post("/api/users/verify", {
+    email: email,
+  });
+
+  return response;
+}
diff --git a/vote/src/api/postSignIn.ts b/vote/src/api/postSignIn.ts
@@ -0,0 +1,30 @@
+import { postSignInTypes } from "types/postSignInTypes";
+import { customAxios } from "./customAxios";
+import { AxiosResponse } from "axios";
+
+export interface SignInResponse {
+  accessToken: string;
+  refreshToken: string;
+  message: string;
+}
+
+interface FullResponse {
+  success: boolean;
+  response: SignInResponse;
+  success_or_error_code: {
+    status: number;
+    message: string;
+  };
+}
+
+export async function postSignIn(
+  props: postSignInTypes,
+): Promise<AxiosResponse<FullResponse>> {
+  const { username, password } = props;
+  const response = await customAxios.post<FullResponse>("/api/users/login", {
+    username,
+    password,
+  });
+
+  return response;
+}
diff --git a/vote/src/api/postSignUp.ts b/vote/src/api/postSignUp.ts
@@ -0,0 +1,17 @@
+import { postSignUpTypes } from "types/postSignUpTypes";
+import { customAxios } from "./customAxios";
+
+export async function postSignUp(props: postSignUpTypes) {
+  const { username, password, email, part, team, name, role } = props;
+  const response = await customAxios.post("/api/users/signup", {
+    username: username,
+    password: password,
+    email: email,
+    part: part,
+    team: team,
+    role: role,
+    name: name,
+  });
+
+  return response;
+}
diff --git a/vote/src/api/postVote.ts b/vote/src/api/postVote.ts
@@ -0,0 +1,12 @@
+import { postVoteTypes } from "types/postVoteTypes";
+import { customAxios } from "./customAxios";
+
+export async function postVote(props: postVoteTypes) {
+  const { topicId, votingOptionId } = props;
+  const response = await customAxios.post("/api/votes", {
+    topicId: topicId,
+    votingOptionId: votingOptionId,
+  });
+
+  return response?.data.data;
+}