#184 feat: 회원가입 폼 제거, 세종대 포털 통합 로그인 페이지 수정

urinaner · Dec 9, 2024 · b5bf269 · b5bf269
1 parent 15414fc
commit b5bf269
Show file tree

Hide file tree

Showing 4 changed files with 71 additions and 245 deletions.
diff --git a/frontend/src/AppContent.tsx b/frontend/src/AppContent.tsx
@@ -29,7 +29,6 @@ import mainImage from './assets/images/main_picture.svg';
 import Curriculum from './pages/Undergraduate/Curriculum/Curriculum';
 
 import NotFound from './components/Notfound/NotFound';
-import SignUpPage from './pages/Auth/SignUpPage';
 
 const PageContainer = styled.div`
   display: flex;
@@ -90,6 +89,7 @@ function AppContent() {
         <Routes>
           {/* 공개 Routes */}
           <Route path="/" element={<Main />} />
+
           <Route
             path="/signin"
             element={
@@ -98,14 +98,6 @@ function AppContent() {
               </ProtectedRoute>
             }
           />
-          <Route
-            path="/signup"
-            element={
-              <ProtectedRoute requireAuth={false}>
-                <SignUpPage />
-              </ProtectedRoute>
-            }
-          />
           <Route
             path="/undergraduate/admission-scholarship"
             element={<Hyperlink />}

diff --git a/frontend/src/pages/Auth/SignInPage.tsx b/frontend/src/pages/Auth/SignInPage.tsx
@@ -12,6 +12,10 @@ import {
   ErrorMessage,
   Tabs,
   Tab,
+  NoticeContainer,
+  NoticeTitle,
+  NoticeList,
+  NoticeItem,
 } from './SignInPageStyle';
 import { AuthContext } from '../../context/AuthContext';
 import { Modal } from '../../components/Modal';
@@ -90,9 +94,24 @@ const SignInForm: React.FC<{ isAdmin: boolean }> = ({ isAdmin }) => {
   return (
     <form onSubmit={handleSubmit}>
       {error && <ErrorMessage>{error}</ErrorMessage>}
+      {!isAdmin && (
+        <NoticeContainer>
+          <NoticeTitle>
+            <span role="img" aria-label="info">
+              ℹ️
+            </span>
+            세종대학교 통합 로그인 안내
+          </NoticeTitle>
+          <NoticeList>
+            <NoticeItem>세종대학교 포털 계정으로 로그인해주세요.</NoticeItem>
+            <NoticeItem>아이디: 학번 (예: 23000123)</NoticeItem>
+            <NoticeItem>비밀번호: 포털 비밀번호</NoticeItem>
+          </NoticeList>
+        </NoticeContainer>
+      )}
       <Input
         type="text"
-        placeholder="아이디"
+        placeholder={isAdmin ? '아이디' : '학번'}
         value={loginId}
         onChange={(e) => setLoginId(e.target.value)}
         disabled={isSubmitting}
@@ -105,23 +124,28 @@ const SignInForm: React.FC<{ isAdmin: boolean }> = ({ isAdmin }) => {
         disabled={isSubmitting}
       />
       <Button type="submit" disabled={isSubmitting}>
-        {isSubmitting ? '로그인 중...' : '로그인'}
+        {isSubmitting
+          ? '로그인 중...'
+          : isAdmin
+            ? '로그인'
+            : '포털 계정으로 로그인'}
       </Button>
       <ActionButtons>
-        <LinkButton
-          type="button"
-          onClick={() => navigate('/find-account')}
-          disabled={isSubmitting}
-        >
-          아이디/비밀번호 찾기
-        </LinkButton>
-        {!isAdmin && (
+        {!isAdmin ? (
           <LinkButton
             type="button"
-            onClick={() => navigate('/signup')}
+            onClick={() => window.open('https://portal.sejong.ac.kr', '_blank')}
             disabled={isSubmitting}
           >
-            회원가입
+            세종대학교 포털 바로가기
+          </LinkButton>
+        ) : (
+          <LinkButton
+            type="button"
+            onClick={() => navigate('/find-account')}
+            disabled={isSubmitting}
+          >
+            아이디/비밀번호 찾기
           </LinkButton>
         )}
       </ActionButtons>

diff --git a/frontend/src/pages/Auth/SignInPageStyle.ts b/frontend/src/pages/Auth/SignInPageStyle.ts
@@ -212,3 +212,37 @@ export const Tab = styled.button<{ active: boolean }>`
     font-size: 14px;
   }
 `;
+
+export const NoticeContainer = styled.div`
+  background-color: #f0f4ff;
+  padding: 1.25rem;
+  margin-bottom: 1.5rem;
+  border-radius: 8px;
+  border: 1px solid #e0e7ff;
+`;
+
+export const NoticeTitle = styled.p`
+  color: #1e40af;
+  font-weight: 600;
+  margin-bottom: 0.75rem;
+  display: flex;
+  align-items: center;
+  gap: 0.5rem;
+  font-size: 0.95rem;
+`;
+
+export const NoticeList = styled.ul`
+  margin: 0;
+  padding-left: 1.5rem;
+`;
+
+export const NoticeItem = styled.li`
+  color: #3b4566;
+  font-size: 0.9rem;
+  line-height: 1.6;
+  margin-bottom: 0.25rem;
+
+  &:last-child {
+    margin-bottom: 0;
+  }
+`;
diff --git a/frontend/src/pages/Auth/SignUpPage.tsx b/frontend/src/pages/Auth/SignUpPage.tsx