[#47] style : 전체 대시보드 가게 메뉴바 추가 (#48)

* Release test 0.0.1 (#41) * feat: 기본 컴포넌트 생성 * feat: 지도 구현 * Update README.md * Update README.md * Update README.md * feat: marker 이미지 추가 * feat: only icon marker 디자인 완료 * feat: name marker 디자인 완료 * refactor: 지도에 보이는 방식 변경 * feat: 업체 리스트 디자인 완료 하트 상태 useState로 관리 * Create pull_request_template.md * feat: 검색창 구현 * feat: 픽한업체 디자인 * refactor: 겹치는 코드 분리 size 인수로 받는 함수 만들어서 그 사이즈에 맞게 이미지 코드 반환 * feat: 필터 디자인 완료 * feat: 스크롤바 디자인 * style: store list 디자인 변경사항 반영 * style: 이름 마커 디자인 수정 * feat: 라우터 설정 * feat: 가게 정보 디자인 완료 * style: heart -> 👍 으로 디자인 변경 * fix: 지도 안뜨는 문제 해결 * refact: 공통 컴포넌트 분리 (필터, 검색창) * refact: 이름 마커 컴포넌트 공통으로 리팩토링 * refact: children props 넘겨주는 방식 변경 * refact: icon marker 코드 하나로 분리 * chore: 해당하는 마커만 지도에 띄우기 * fix: 우선 error는 안뜨도록 수정 * fix: 같은 매장 여러번 클릭할 수 있도록 수정 * fix: 기본값 설정 * docs: PR template update 체크리스트 추가 * [#17] feat: 헤더 #17 (#21) * feat : 화면 구현 * feat : 헤더 구현 * style : 알림 아이콘 추가 * [#3] feat: 제휴가게 페이지 (#13) * feat: component 구성 * style: 타이틀 디자인 구현 완성 * style: 필터, 검색, 버튼 디자인 완료 * style: store 컴포넌트 디자인 완료 * style: 변경된 디자인 반영 * feat: 가게 검색 모달 창 디자인 완료 * feat: 공통 버튼 컴포넌트 분리 * feat: [제휴가게 조회] 컴포넌트 구성 * style: [제휴가게 조회] 화면 디자인 완료 * feat: 스탬프 모달 완성 * feat: 조건 박스 추가 * refact: modal 폴더 생성 * feat: 제휴 종료 모달 완성 * fix: 버튼 스타일링 변경 * refact: && 연산자로 변경 * [#22] feat: 가게 찾기 페이지 API 연결 (#25) * fix: img 오류 수정 * feat: api data 형식 추가 및 적용 * feat: 가게 전체 조회 api 연결 * style: 제목 div 깨짐 수정 * feat: map type filter 설정 * feat: filter API 설정 * feat: 위도 경도 연결 * refact: 전체 필터용으로 api 방식 수정 * feat: 픽한업체 필터 설정 * feat: 검색어 필터 연결 /contact 부분 props 수정 필요 * feat: storeInfo와 filter 예외처리 storeInfo가 열려있는 상태로 filter를 누르면 지도 내용이 누른 filter를 반영하도록 변경 * chore: 사용안하는 코드 삭제 * feat: 픽한 업체 API 연결 * feat: 가게 상세 정보 조회 API 연결 * fix: 선택한 가게 기본값 설정 * feat: 이름 마커 zindex 설정 * feat: 맨 위 데이터 "이름 마커" 로 뜨는 조건 * style: 디자인적 요소 수정 cursor 포인터로, 도보 시간 0분으로 안뜨도록, 픽한 업체 글자 눌렀을때도 클릭 되도록 * [#24] feat : 팝업관리, 쿠폰관리, 마이페이지, 대시보드 화면 구현 (#29) * feat : 화면 구현 * feat : 헤더 구현 * feat : 로그인 모달 구현 * feat : 회원가입 화면 구현 * style : header 알림 아이콘 추가 * style : 로그인 모달 세부 디자인 수정 * feat : api 설정 및 부분 연동 * feat : 로그인 액세스토큰 세션 스토리지에 저장 * feat : 대시보드 레이아웃 잡기 * feat : 첫번째 박스 구현 * feat : 두번째 박스 구현 * feat : 대시보드 화면 완성 * feat : 쿠폰관리 리스트 화면 구현 * feat : 팝업관리 화면 구현 * feat : popup api 연동 * feat : 쿠폰 등록 화면 구현 * feat : 비었을때 보여줄 컴포넌트 삽입 * feat : 팝업등록 화면 구현 * feat : 마이페이지 화면 구현 * feat : 팝업관리 화면 구현, 일부 api 연동 * [#16] feat: 팝업관리 페이지 디자인 구현 (#31) * feat: 가게 검색 모달 창 디자인 완료 * feat: 스탬프 모달 완성 * feat: 조건 박스 추가 * refact: modal 폴더 생성 * feat: 컴포넌트 구성 * feat: 팝업 관리 페이지 디자인 완료 * feat: 환경 설정 package json 수정, base api 수정 * [#28] feat: 제휴가게 API 연결 (#37) * fix: icon 에러 수정 * feat: 제휴가게리스트 API 연결 * feat: 라우터 연결 * fix: img 오류 수정 * feat: 제휴가게 상세 API 연결 * feat: modal api 연결 및 디자인 수정 * style: checkbox 적용 * [#39] fix : 서브메뉴 디자인 변경 및 링크추가 (#40) * style : 팝업 / 쿠폰 관리 삭제박스 추가 * fix : 헤더 디자인 수정 및 링크 추가 --------- Co-authored-by: Ethan Lim <studentlimsoo@gmail.com> * fix : 타입 오류 수정 * fix: error 수정 * fix : 타입 오류 수정 * fix: modal error * fix: npm run build error * fix: build error 해결 * fix: 위치 에러 수정 * feat : 가게 대시보드 구현 * style : 대시보드 가게 메뉴 추가 --------- Co-authored-by: SuJin <kimsujin001127@gmail.com>
KUSITMS-Team-A · Nov 22, 2023 · 95b2030 · 95b2030
1 parent 21d146f
commit 95b2030
Show file tree

Hide file tree

Showing 6 changed files with 27 additions and 7 deletions.
diff --git a/components/hooks/usePopupData.ts b/components/hooks/usePopupData.ts
@@ -2,6 +2,7 @@ import { getPopups } from "@/pages/api/popup";
 import { useEffect, useState } from "react";
 
 
+
 interface Popup {
   title: string;
   content: string;

diff --git a/pages/dashboard/[store].tsx b/pages/dashboard/[store].tsx
@@ -50,7 +50,9 @@ const StorePage = () => {
           <FirstLayerChart title="신규 방문 인원" content="5" />
         </styles.SecondBox>
         <styles.ThirdBox>
-          <FirstLayerChart title="1인 평균 제휴 횟수" content="1.3회" />
+
+          <FirstLayerChart title="평균 혜택 이용 수" content="1.3회" />
+
         </styles.ThirdBox>
         <styles.FourthBox>
           <ComposedChart title="총 판매 금액 & 제휴 제공 금액" />

diff --git a/pages/dashboard/index.tsx b/pages/dashboard/index.tsx
@@ -9,6 +9,7 @@ import StackCharts from "./StackCharts";
 import ListChart from "./ListChart";
 import { useDashBoardData } from "@/components/hooks/useDashBoardData";
 import BarChart from "./BarChart";
+import Filter from "@/components/organisms/Filter";
 
 interface DashBoardProps {}
 interface DateState {
@@ -25,6 +26,10 @@ const DashBoardPage: React.FC = () => {
   const { dateRange, calculateDateRange } = useDateRange();
   const barChartData = useDashBoardData({ selection: 1 }).data;
   const barChartData2 = useDashBoardData({ selection: 2 }).data;
+  const [contentFilter, setContentFilter] = useState<
+    "NONE" | "FOOD" | "CAFE" | "BEAUTY" | "CULTURE" | "ETC"
+  >("FOOD");
+
   const [dateFilter, setDateFilter] = useState<DateState>({
     dates: dates.aWeek,
   });
@@ -55,15 +60,15 @@ const DashBoardPage: React.FC = () => {
         </styles.TitleContainer>
 
         <styles.OptionContainer>
-          <styles.ButtonWrapper>
+          {/* <styles.ButtonWrapper>
             <styles.IndexButton>전체</styles.IndexButton>
             <styles.IndexButton>음식점</styles.IndexButton>
             <styles.IndexButton>카페</styles.IndexButton>
             <styles.IndexButton>미용</styles.IndexButton>
             <styles.IndexButton>문화</styles.IndexButton>
             <styles.IndexButton>기타</styles.IndexButton>
-          </styles.ButtonWrapper>
-
+          </styles.ButtonWrapper> */}
+          <Filter setContentFilter={setContentFilter} />
           <styles.ButtonWrapper>
             <styles.IndexButton>최근 7일</styles.IndexButton>
             <styles.IndexButton>최근 14일</styles.IndexButton>

diff --git a/pages/student/popup/index.tsx b/pages/student/popup/index.tsx
@@ -9,6 +9,7 @@ import EmptyComponent from "@/components/atoms/EmptyComponent";
 import { usePopupData } from "@/components/hooks/usePopupData";
 import { Checkbox } from "@mui/material";
 
+
 const PopupAdminPage: React.FC = () => {
   const router = useRouter();
 
@@ -85,6 +86,5 @@ const PopupAdminPage: React.FC = () => {
   );
 };
 
-
 export default PopupAdminPage;
 
diff --git a/pages/user/form/index.tsx b/pages/user/form/index.tsx
@@ -10,7 +10,6 @@ import { useRouter } from "next/router";
 import { css } from "@emotion/css";
 import styled from "@emotion/styled";
 
-
 interface FormPageProps {}
 
 enum Unions {

diff --git a/pages/user/index.tsx b/pages/user/index.tsx
@@ -3,7 +3,8 @@ import { Checkbox } from "@mui/material";
 import Head from "next/head";
 import { useRouter } from "next/router";
 import { useEffect, useState } from "react";
-
+import CheckCircleIcon from "@mui/icons-material/CheckCircle";
+import CircleIcon from "@mui/icons-material/Circle";
 interface UserProps {
   name?: string;
   isLogin?: boolean;
@@ -82,6 +83,10 @@ const UserPage: React.FC<UserProps> = () => {
           <styles.AgreementInnerBox>
             <styles.Checks style={{ borderBottom: "1px solid #D0D0D0" }}>
               <Checkbox
+
+                icon={<CircleIcon />}
+                checkedIcon={<CheckCircleIcon />}
+
                 onChange={(e: React.ChangeEvent<HTMLInputElement>) => {
                   const { checked } = e.target;
                   checked
@@ -105,6 +110,8 @@ const UserPage: React.FC<UserProps> = () => {
             </styles.Checks>
             <styles.Checks>
               <Checkbox
+                icon={<CircleIcon />}
+                checkedIcon={<CheckCircleIcon />}
                 checked={checked.second}
                 name="second"
                 onChange={checkBoxHandler}
@@ -113,6 +120,8 @@ const UserPage: React.FC<UserProps> = () => {
             </styles.Checks>
             <styles.Checks>
               <Checkbox
+                icon={<CircleIcon />}
+                checkedIcon={<CheckCircleIcon />}
                 name="third"
                 checked={checked.third}
                 onChange={checkBoxHandler}
@@ -121,6 +130,8 @@ const UserPage: React.FC<UserProps> = () => {
             </styles.Checks>
             <styles.Checks>
               <Checkbox
+                icon={<CircleIcon />}
+                checkedIcon={<CheckCircleIcon />}
                 name="fourth"
                 checked={checked.fourth}
                 onChange={checkBoxHandler}
@@ -129,6 +140,8 @@ const UserPage: React.FC<UserProps> = () => {
             </styles.Checks>
             <styles.Checks>
               <Checkbox
+                icon={<CircleIcon />}
+                checkedIcon={<CheckCircleIcon />}
                 name="fifth"
                 checked={checked.fifth}
                 onChange={checkBoxHandler}