Skip to content

Commit

Permalink
Merge pull request #198 from themoment-team/develop
Browse files Browse the repository at this point in the history
Release v1.4.0
  • Loading branch information
hyeongrok7874 committed Oct 23, 2022
2 parents 74fc84d + 7540fd8 commit c65e797
Show file tree
Hide file tree
Showing 9 changed files with 447 additions and 12 deletions.
53 changes: 51 additions & 2 deletions packages/hello-gsm/src/PageContainer/MainPage/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,14 @@ import React, { useEffect, useState } from 'react';
import type { NextPage } from 'next';
import * as S from './style';
import Link from 'next/link';
import { Header, Footer, MainPageDescription, BubbleButton } from 'components';
import {
Header,
Footer,
MainPageDescription,
BubbleButton,
MainResultModal,
MainNonLoginModal,
} from 'components';
import { css } from '@emotion/react';
import { StatusType } from 'type/user';
import useStore from 'Stores/StoreContainer';
Expand All @@ -22,8 +29,15 @@ const MainPage: NextPage<StatusType> = ({ data }) => {
const [isPC, setIsPC] = useState<boolean>(true);
const [isMobile, setIsMobile] = useState<boolean>(false);
const [isAcceptable, setIsAcceptable] = useState<boolean>(false);
const [isFirstResultPeriod, setIsFirstResultPeriod] = useState<boolean>(true);

const { logged } = useStore();
const {
showMainNonLoginModal,
setShowMainNonLoginModal,
showMainResultModal,
setShowMainResultModal,
logged,
} = useStore();

const selectedStyle = (index: number) =>
selectedIndex === index &&
Expand All @@ -45,6 +59,7 @@ const MainPage: NextPage<StatusType> = ({ data }) => {
`;

useEffect(() => {
setIsFirstResultPeriod(new Date() < new Date('2022/11/2 10:00:00'));
setIsMobile(window.innerWidth < 640 ? true : false);
setIsAcceptable(acceptable);
setIsPC(
Expand All @@ -57,8 +72,42 @@ const MainPage: NextPage<StatusType> = ({ data }) => {
};
}, []);

useEffect(() => {
setShowMainNonLoginModal(
new Date() >= new Date('2022/10/24 10:00:00') &&
!logged &&
localStorage.getItem('mainNonLoginModalInvisible') !==
new Date().getDate().toString(),
);
}, [logged]);

useEffect(() => {
setShowMainResultModal(
new Date() >= new Date('2022/10/24 10:00:00') &&
localStorage.getItem('mainResultModalInvisible') !==
new Date().getDate().toString() &&
!(data?.application?.isFinalSubmission === true),
);
}, [data?.application?.isFinalSubmission]);

return (
<S.MainPage>
{showMainResultModal && (
<MainResultModal
name={data?.name ?? ''}
pass={
isFirstResultPeriod
? data?.application?.firstResultScreening
? true
: false
: data?.application?.finalResultScreening
? true
: false
}
isMobile={isMobile}
/>
)}
{showMainNonLoginModal && <MainNonLoginModal />}
<Header />
<S.MainContent>
<S.TitleWrap>
Expand Down
4 changes: 4 additions & 0 deletions packages/hello-gsm/src/PageContainer/MainPage/style.ts
Original file line number Diff line number Diff line change
Expand Up @@ -76,6 +76,10 @@ export const Title = styled.p`
font-size: 40px;
line-height: 50px;
}
@media (max-width: 335px) {
font-size: 35px;
line-height: 45px;
}
`;

export const Description = styled.p`
Expand Down
8 changes: 8 additions & 0 deletions packages/hello-gsm/src/Stores/StoreContainer.ts
Original file line number Diff line number Diff line change
Expand Up @@ -24,6 +24,8 @@ interface StoreType {
freeSemester: string | null;
system: string;
showApplyPostModal: boolean;
showMainResultModal: boolean;
showMainNonLoginModal: boolean;

setLogged: (isLogged: boolean) => void;
setShowFAQModal: () => void;
Expand Down Expand Up @@ -54,6 +56,8 @@ interface StoreType {
setFreeSemester: (value: string | null) => void;
setSystem: (type: string) => void;
setshowApplyPostModal: () => void;
setShowMainResultModal: (isShow: boolean) => void;
setShowMainNonLoginModal: (isShow: boolean) => void;
}

const useStore = create<StoreType>(set => ({
Expand All @@ -80,6 +84,8 @@ const useStore = create<StoreType>(set => ({
freeSemester: null,
system: '자유학년제',
showApplyPostModal: false,
showMainResultModal: false,
showMainNonLoginModal: false,

setLogged: isLogged => set({ logged: isLogged }),
setShowFAQModal: () => set(state => ({ showFAQModal: !state.showFAQModal })),
Expand Down Expand Up @@ -113,6 +119,8 @@ const useStore = create<StoreType>(set => ({
set(state => ({
showApplyPostModal: !state.showApplyPostModal,
})),
setShowMainResultModal: isShow => set({ showMainResultModal: isShow }),
setShowMainNonLoginModal: isShow => set({ showMainNonLoginModal: isShow }),
}));

export default useStore;
23 changes: 13 additions & 10 deletions packages/hello-gsm/src/components/MainPageDescription/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -10,10 +10,10 @@ const MainPageDescription: React.FC<MainDescStatusType> = ({
data,
}) => {
const today = new Date();
const [isFirstPeriod, setIsFirstPeriod] = useState<boolean>(false);
const [isFirstPeriod, setIsFirstPeriod] = useState<boolean>(true);
const [pass, setPass] = useState<boolean>(false);
const firstResult = data?.application?.firstResultScreening ? true : false;
const finalResult = data?.application?.finalResultScreening ? true : false;
const [pass, setPass] = useState<boolean>(false);
const [index, setIndex] = useState<number>(1);
const name = data?.name ?? '';
const registrationNumber = data?.application?.registrationNumber ?? '';
Expand All @@ -30,15 +30,18 @@ const MainPageDescription: React.FC<MainDescStatusType> = ({
}, [isFirstPeriod]);

useEffect(() => {
today > new Date('2023-03-01 00:00:00')
today > new Date('2023/03/01 00:00:00')
? setIndex(0)
: setIndex(selectedIndex);
if (data) {
today < new Date('2022-10-24 10:00:00') &&
selectedIndex === 5 &&
setIndex(7);
} else {
selectedIndex === 5 && setIndex(6);
if (selectedIndex === 5) {
if (data) {
today >= new Date('2022/10/24 10:00:00') &&
(data.application?.isFinalSubmission ?? false)
? setIndex(5)
: setIndex(7);
} else {
setIndex(6);
}
}
}, [selectedIndex]);

Expand Down Expand Up @@ -118,7 +121,7 @@ const MainPageDescription: React.FC<MainDescStatusType> = ({
중심으로 직무적성 소양평가를 치룹니다.
</S.DescriptionLine>
<S.PostScript>
2022.10.28. 직무적성 소양평가 진행 <br />
2022.10.28. 13시 직무적성 소양평가 진행 <br />
2022.11.02. 10시 최종 결과 발표
</S.PostScript>
</S.Description>
Expand Down
Original file line number Diff line number Diff line change
@@ -0,0 +1,43 @@
import { Global, css } from '@emotion/react';
import React from 'react';
import * as S from './style';
import useStore from 'Stores/StoreContainer';

const MainNonLoginModal: React.FC = () => {
const { setShowMainNonLoginModal } = useStore();

const invisible = () => {
setShowMainNonLoginModal(false);
localStorage.setItem(
'mainNonLoginModalInvisible',
new Date().getDate().toString(),
);
};

return (
<S.MainResultModal>
<Global
styles={css`
body {
overflow: hidden;
}
`}
/>
<S.MainResultModalBox>
<S.MainResultModalContent>
<S.Text>결과 확인을 위해 로그인을 해주세요.</S.Text>
</S.MainResultModalContent>
<S.InvisibleButtonWrap>
<S.InvisibleButton onClick={invisible}>
오늘 하루 보지 않기
</S.InvisibleButton>
</S.InvisibleButtonWrap>
<S.ConfirmButton onClick={() => setShowMainNonLoginModal(false)}>
확인
</S.ConfirmButton>
</S.MainResultModalBox>
</S.MainResultModal>
);
};

export default MainNonLoginModal;
103 changes: 103 additions & 0 deletions packages/hello-gsm/src/components/Modals/MainNonLoginModal/style.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,103 @@
import styled from '@emotion/styled';
import device from 'shared/config';

export const MainResultModal = styled.div`
width: 100%;
height: 100vh;
background-color: rgba(0, 0, 0, 0.51);
display: flex;
justify-content: center;
align-items: center;
position: fixed;
z-index: 5;
`;

export const MainResultModalBox = styled.div`
width: 710px;
height: 320px;
display: flex;
flex-direction: column;
justify-content: space-between;
align-items: center;
@media (max-width: 710px) {
width: 90%;
}
@media ${device.mobile} {
width: 95%;
height: 300px;
}
`;

export const MainResultModalContent = styled.div`
width: 100%;
height: 200px;
background: #ffffff;
border-radius: 20px;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
`;

export const Text = styled.p`
font-weight: 700;
font-size: 20px;
line-height: 29px;
text-align: center;
color: #0f0921;
@media ${device.mobile} {
font-size: 16px;
}
`;

export const InvisibleButtonWrap = styled.div`
width: 100%;
display: flex;
justify-content: flex-end;
`;

export const InvisibleButton = styled.button`
width: 160px;
display: flex;
justify-content: space-between;
align-items: center;
font-weight: 400;
font-size: 16px;
color: #ffffff;
background: inherit;
border: none;
cursor: pointer;
padding: 0;
@media ${device.mobile} {
width: 125px;
font-size: 13px;
}
&::before {
content: '';
width: 15px;
height: 15px;
background: #c9c9c9;
border-radius: 4px;
@media ${device.mobile} {
width: 12px;
height: 12px;
}
}
`;

export const ConfirmButton = styled.button`
width: 155px;
height: 45px;
background: #42bafe;
border-radius: 10px;
font-weight: 700;
font-size: 20px;
color: #ffffff;
border: none;
cursor: pointer;
@media ${device.mobile} {
width: 130px;
height: 37px;
font-size: 16px;
}
`;
Loading

2 comments on commit c65e797

@vercel
Copy link

@vercel vercel bot commented on c65e797 Oct 23, 2022

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Successfully deployed to the following URLs:

hello-gsm – ./packages/hello-gsm

www.hellogsm.kr
hello-gsm-hello-gsm.vercel.app
hello-gsm-git-main-hello-gsm.vercel.app
hellogsm.kr

@vercel
Copy link

@vercel vercel bot commented on c65e797 Oct 23, 2022

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Successfully deployed to the following URLs:

hello-gsm-admin – ./packages/hello-gsm-admin

hello-gsm-admin-hello-gsm.vercel.app
hello-gsm-admin-git-main-hello-gsm.vercel.app
admin.hellogsm.kr
hello-gsm-admin.vercel.app

Please sign in to comment.