kobaco-c-team · chamny20 · Mar 10, 2024 · Mar 7, 2024 · Mar 7, 2024 · Mar 7, 2024
diff --git a/.eslintrc.cjs b/.eslintrc.cjs
@@ -14,6 +14,6 @@ module.exports = {
       'warn',
       { allowConstantExport: true },
     ],
-    '@typescript-eslint/no-explicit-any': 'off',
+    '@typescript-eslint/no-unused-vars': 'off',
   },
 };
diff --git a/.eslintrc.json b/.eslintrc.json
@@ -14,6 +14,8 @@
   },
   "plugins": ["react", "react-hooks"],
   "rules": {
+    "no-unused-vars": "off",
+    "@typescript-eslint/no-unused-vars": "error",
     "import/extensions": [
       "error",
       "ignorePackages",

diff --git a/index.html b/index.html
@@ -2,8 +2,9 @@
 <html lang="en">
   <head>
     <meta charset="UTF-8" />
-    <link rel="icon" type="image/svg+xml" href="/vite.svg" />
+    <link rel="icon" type="image/svg+xml" href="/kobaco.svg" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
     <title>Kobaco</title>
   </head>
   <body>

diff --git a/package.json b/package.json
@@ -10,28 +10,40 @@
     "preview": "vite preview"
   },
   "dependencies": {
-    "@emotion/react": "^11.11.4",
-    "@emotion/styled": "^11.11.0",
+    "@emotion/react": "11.11.4",
+    "@emotion/styled": "11.11.0",
     "@headlessui/react": "^1.7.18",
     "@mui/icons-material": "^5.15.12",
-    "@mui/material": "^5.15.11",
+    "@mui/material": "5.15.12",
+    "@mui/x-date-pickers": "6.19.6",
+    "@nivo/bar": "0.85.1",
+    "@nivo/bullet": "0.85.1",
+    "@nivo/core": "0.85.1",
+    "@types/axios": "^0.14.0",
     "@types/babel__core": "7.20.5",
     "@types/babel__traverse": "7.20.5",
     "@types/react-slick": "^0.23.13",
     "@types/styled-components": "5.1.34",
+    "axios": "^1.6.7",
+    "d3": "^7.8.5",
+    "dayjs": "1.11.10",
     "eslint-config-prettier": "9.1.0",
     "eslint-import-resolver-typescript": "3.6.1",
     "eslint-plugin-prettier": "5.1.3",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
+    "react-minimal-pie-chart": "^8.4.0",
     "react-router-dom": "6.22.2",
     "react-slick": "^0.30.2",
+    "recharts": "^2.12.2",
     "slick-carousel": "^1.8.1",
     "styled-components": "^6.1.8"
   },
   "devDependencies": {
+    "@types/d3": "^7.4.3",
     "@types/react": "^18.2.56",
     "@types/react-dom": "^18.2.19",
+    "@types/recharts": "^1.8.29",
     "@typescript-eslint/eslint-plugin": "^6.4.0",
     "@typescript-eslint/parser": "^7.0.2",
     "@vitejs/plugin-react": "^4.2.1",

diff --git a/public/kobaco.svg b/public/kobaco.svg
diff --git a/public/vite.svg b/public/vite.svg
diff --git a/src/api/advertisement.ts b/src/api/advertisement.ts
@@ -0,0 +1,81 @@
+import { api } from '.';
+import { AdvertisementListType, ScrappedAdvType } from '../types/api';
+
+// 광고 리스트 조회
+export const getAdvertisementList = async ({
+  sortType,
+  startDate,
+  endDate,
+  kwdVal,
+  expressionType,
+  moodType,
+}: AdvertisementListType) => {
+  const res = await api.get('/api/advertisement/list', {
+    params: {
+      sortType,
+      startDate,
+      endDate,
+      kwdVal,
+      expressionType,
+      moodType,
+    },
+  });
+  return res;
+};
+
+// 비슷한 영상 광고 리스트 조회
+export const getSimilarAdvertisement = async (advertisementId: number) => {
+  const res = await api.get(`/api/advertisement/similar/${advertisementId}`);
+  return res;
+};
+
+// 광고 기본 정보 조회
+export const getAdvertisementInfo = async (advertisementId: number) => {
+  const res = await api.get(`/api/advertisement/info/${advertisementId}`);
+  return res;
+};
+
+// 광고 표정 분석 조회
+export const getAdvertisementExpression = async (advertisementId: number) => {
+  const res = await api.get(`/api/advertisement/expression/${advertisementId}`);
+  return res;
+};
+
+// 광고 영상 분석 결과 조회(영상 분위기, 인물, 사물)
+export const getAdvertisementAnalysis = async (advertisementId: number) => {
+  const res = await api.get(`/api/advertisement/analysis/${advertisementId}`);
+  return res;
+};
+
+// 영상 분석 결과 조회(이미지만 조회), category는 {person, objet, place}만 가능
+export const getAdvertisementAiAnalysisCategory = async (
+  advertisementId: number,
+  category: string
+) => {
+  const res = await api.get(
+    `/api/advertisement/ai-analysis/${advertisementId}/${category}`
+  );
+  return res;
+};
+
+// 광고 스크랩
+export const getAdvertisementScrap = async (advertisementId: number) => {
+  const res = await api.patch(`/api/advertisement/archive/${advertisementId}`);
+  return res;
+};
+
+// 스크랩한 광고 조회
+export const getScrappedAdvertisementList = async ({
+  moodType,
+  expressionType,
+  kwdVal,
+}: ScrappedAdvType) => {
+  const res = await api.get('/api/advertisement/archive', {
+    params: {
+      moodType,
+      expressionType,
+      kwdVal,
+    },
+  });
+  return res;
+};
diff --git a/src/api/index.ts b/src/api/index.ts
@@ -0,0 +1,5 @@
+import axios from 'axios';
+
+export const api = axios.create({
+  baseURL: 'http://43.203.36.63:8080',
+});
diff --git a/src/api/trend.ts b/src/api/trend.ts
@@ -0,0 +1,43 @@
+import { api } from '.';
+import { TrendSearchType } from '../types/api';
+
+// sns 트렌드 검색, kwdVal은 검색어, snsType(INSTAGRAM, YOUTUBE)은 sns 유형
+export const getTrendSearch = async ({ kwdVal, snsType }: TrendSearchType) => {
+  const res = await api.get(`/api/trend`, {
+    params: {
+      kwdVal,
+      snsType,
+    },
+  });
+  return res;
+};
+
+// 트렌드 월별 & 요일별 분석 조회
+export const getTrendTime = async ({ trendKwd }: { trendKwd: string }) => {
+  const res = await api.get(`/api/trend/time`, {
+    params: {
+      trendKwd,
+    },
+  });
+  return res;
+};
+
+// 트렌드 성별 & 나이 분석 조회
+export const getTrendPerson = async ({ trendKwd }: { trendKwd: string }) => {
+  const res = await api.get(`/api/trend/person`, {
+    params: {
+      trendKwd,
+    },
+  });
+  return res;
+};
+
+// 트렌드 성별 & 나이 분석 조회
+export const getTrendArchive = async ({ trendKwd }: { trendKwd: string }) => {
+  const res = await api.get(`/api/trend/`, {
+    params: {
+      trendKwd,
+    },
+  });
+  return res;
+};
diff --git a/src/assets/advertisement/1-object.png b/src/assets/advertisement/1-object.png
diff --git a/src/assets/advertisement/1-person.png b/src/assets/advertisement/1-person.png
diff --git a/src/assets/advertisement/1-place.png b/src/assets/advertisement/1-place.png
diff --git a/src/assets/advertisement/adv_bg.png b/src/assets/advertisement/adv_bg.png
diff --git a/src/assets/advertisement/ex_basic.png b/src/assets/advertisement/ex_basic.png
diff --git a/src/assets/advertisement/ex_smile.png b/src/assets/advertisement/ex_smile.png
diff --git a/src/assets/advertisement/ex_surprise.png b/src/assets/advertisement/ex_surprise.png
diff --git a/src/assets/chart/insta.png b/src/assets/chart/insta.png
diff --git a/src/assets/chart/modalGraph.png b/src/assets/chart/modalGraph.png
diff --git a/src/assets/chart/naver.png b/src/assets/chart/naver.png
diff --git a/src/assets/chart/youtube.png b/src/assets/chart/youtube.png
diff --git a/src/assets/favorite.svg b/src/assets/favorite.svg
diff --git a/src/assets/landing/newtrend1.png b/src/assets/landing/newtrend1.png
diff --git a/src/assets/landing/newtrend2.png b/src/assets/landing/newtrend2.png