merge :: 내 기업정보 페이지 값 변경

Team-return · Nov 6, 2024 · 90bd968 · 90bd968
2 parents 3073bca + 751e8a0
commit 90bd968
Show file tree

Hide file tree

Showing 7 changed files with 124 additions and 21 deletions.
diff --git a/apps/company/src/apis/company/types.ts b/apps/company/src/apis/company/types.ts
@@ -16,6 +16,7 @@ export interface IUpdateCompanyInfoRequest {
   company_profile_url?: string;
   service_name: string;
   business_area_code: number | string;
+  manager_phone_no: string;
 }
 export interface ICompanyRegisterRequest extends IUpdateCompanyInfoRequest {
   name: string;

diff --git a/apps/company/src/app/company/page.tsx b/apps/company/src/app/company/page.tsx
@@ -2,7 +2,7 @@
 
 import Image from "next/image";
 import * as S from "./style";
-import { Text, Flex } from "@jobis/ui";
+import { Text, Flex, Icon } from "@jobis/ui";
 import SeeMoreIcon from "../../../public/seemore.svg";
 import { themes } from "@jobis/design-token";
 import { CompanyContentTemplate } from "@/components/companyContentTemplate";
@@ -114,6 +114,65 @@ export default function Company() {
             title="대표 번호"
             content={myCompanyInfo?.representative_phone_no}
           />
+          <CompanyContentTemplate
+            title="사업자 등록증"
+            content={
+              myCompanyInfo?.biz_registration_url ? (
+                <S.FileWrapper type="button">
+                  <Flex align="center" gap={4}>
+                    <Icon
+                      icon="FileEarmarkArrowDown"
+                      size={16}
+                      color={themes.Color.grayScale[60]}
+                    />
+                    <Text
+                      fontSize="body3"
+                      fontWeight="regular"
+                      color={themes.Color.grayScale[60]}
+                      whiteSpace="nowrap"
+                      style={{ textOverflow: "ellipsis", maxWidth: 500 }}
+                    >
+                      {myCompanyInfo.biz_registration_url
+                        .split("/")
+                        .pop()
+                        ?.replace(/^[\w-]+-/, "")}
+                    </Text>
+                  </Flex>
+                </S.FileWrapper>
+              ) : null
+            }
+          />
+          <CompanyContentTemplate
+            title="파일첨부"
+            content={
+              myCompanyInfo?.attachment_urls &&
+              myCompanyInfo.attachment_urls.length > 0
+                ? myCompanyInfo.attachment_urls.map((file, idx) => (
+                    <S.FileWrapper type="button" key={idx}>
+                      <Flex align="center" gap={4}>
+                        <Icon
+                          icon="FileEarmarkArrowDown"
+                          size={16}
+                          color={themes.Color.grayScale[60]}
+                        />
+                        <Text
+                          fontSize="body3"
+                          fontWeight="regular"
+                          color={themes.Color.grayScale[60]}
+                          whiteSpace="nowrap"
+                          style={{ textOverflow: "ellipsis", maxWidth: 500 }}
+                        >
+                          {file
+                            .split("/")
+                            .pop()
+                            ?.replace(/^[\w-]+-/, "")}
+                        </Text>
+                      </Flex>
+                    </S.FileWrapper>
+                  ))
+                : null
+            }
+          />
         </Flex>
       </Flex>
     </S.Container>

diff --git a/apps/company/src/app/company/style.ts b/apps/company/src/app/company/style.ts
@@ -40,3 +40,15 @@ export const IconWrapper = styled.div`
   position: relative;
   display: inline-block;
 `;
+
+export const FileWrapper = styled.button`
+  display: flex;
+  align-items: center;
+  padding: 4px 8px;
+  border: none;
+  border-radius: 88px;
+
+  background-color: ${themes.Color.grayScale[30]};
+  outline: none;
+  gap: 12px;
+`;
diff --git a/apps/company/src/app/registration/page.tsx b/apps/company/src/app/registration/page.tsx
@@ -17,14 +17,7 @@ import {
 import { themes } from "@jobis/design-token";
 import { Controller, SubmitHandler, useForm } from "react-hook-form";
 import { ICompanyRegisterRequest } from "@/apis/company/types";
-import {
-  RefObject,
-  TextareaHTMLAttributes,
-  useCallback,
-  useEffect,
-  useRef,
-  useState,
-} from "react";
+import { RefObject, useCallback, useEffect, useRef, useState } from "react";
 import { useModal } from "@/hooks/useModal";
 import { Address } from "react-daum-postcode";
 import DaumPostcode from "react-daum-postcode";
@@ -42,7 +35,6 @@ import {
 } from "@/hooks/apis/useCompanyApi";
 import { useGetCode } from "@/hooks/apis/useCodeApi";
 import { AxiosError } from "axios";
-import { Background } from "@/components/modal/style";
 
 export default function Registration() {
   const searchParams = useSearchParams();
@@ -85,6 +77,7 @@ export default function Registration() {
       manager_name: myCompanyInfo?.manager_name || "",
       company_profile_url: myCompanyInfo?.company_logo_url,
       headquarter: myCompanyInfo?.headquarter || false,
+      manager_phone_no: myCompanyInfo?.manager_phone_no || "",
     },
   });
   const { toast } = useToast();
@@ -365,6 +358,36 @@ export default function Registration() {
               errorMessage={errors.business_number?.message}
             />
           </InputTemplate>,
+          <InputTemplate
+            key="representative_phone_no"
+            title="기업 대표번호"
+            required
+          >
+            <Controller
+              control={control}
+              name="representative_phone_no"
+              rules={{
+                required: "필수 입력 항목입니다.",
+                pattern: {
+                  value: /^\d{2,3}-\d{3,4}-\d{4}$/,
+                  message: "유효한 전화번호 형식이 아닙니다.",
+                },
+              }}
+              render={({ field }) => (
+                <Input
+                  {...field}
+                  type="tel"
+                  width={604}
+                  placeholder="nnn-nnnn-nnnn"
+                  maxLength={13}
+                  onChange={e =>
+                    field.onChange(regex.phone_number(e.target.value))
+                  }
+                  errorMessage={errors.representative_phone_no?.message}
+                />
+              )}
+            />
+          </InputTemplate>,
           <InputTemplate key="representative-name" title="대표자" required>
             <Input
               width={604}
@@ -559,14 +582,10 @@ export default function Registration() {
                 errorMessage={errors.manager_name?.message}
               />
             </InputTemplate>
-            <InputTemplate
-              key="representative_phone_no"
-              title="대표 연락처"
-              required
-            >
+            <InputTemplate key="manager_phone_no" title="전화번호" required>
               <Controller
                 control={control}
-                name="representative_phone_no"
+                name="manager_phone_no"
                 rules={{
                   required: "필수 입력 항목입니다.",
                   pattern: {
@@ -584,7 +603,7 @@ export default function Registration() {
                     onChange={e =>
                       field.onChange(regex.phone_number(e.target.value))
                     }
-                    errorMessage={errors.representative_phone_no?.message}
+                    errorMessage={errors.manager_phone_no?.message}
                   />
                 )}
               />

diff --git a/apps/company/src/components/companyContentTemplate/index.tsx b/apps/company/src/components/companyContentTemplate/index.tsx
@@ -2,7 +2,7 @@ import * as S from "./style";
 
 interface PropType {
   title: string;
-  content?: string | number;
+  content?: React.ReactNode;
 }
 
 export const CompanyContentTemplate = ({ title, content }: PropType) => {

diff --git a/apps/company/src/components/modal/editModal/editModal.tsx b/apps/company/src/components/modal/editModal/editModal.tsx
@@ -24,11 +24,14 @@ const EditModal: React.FC<PropsType> = () => {
   return (
     <S.Container>
       <Link
+        style={{ width: "100%", height: "100%" }}
         href={`/registration?name=${myCompanyInfo?.name}&business-number=${myCompanyInfo?.biz_no}&type=edit`}
       >
-        <Text fontSize="caption" color={themes.Color.grayScale[60]}>
-          수정
-        </Text>
+        <S.Box>
+          <Text fontSize="caption" color={themes.Color.grayScale[60]}>
+            수정
+          </Text>
+        </S.Box>
       </Link>
       <Text fontSize="caption" color={themes.Color.grayScale[60]}>
         로그아웃

diff --git a/apps/company/src/components/modal/editModal/style.ts b/apps/company/src/components/modal/editModal/style.ts
@@ -19,3 +19,12 @@ export const Container = styled.div`
   gap: 16px;
   box-shadow: 0 4px 20px 0 rgb(112 144 176 / 12%);
 `;
+
+export const Box = styled.div`
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  width: 100%;
+  height: 50%;
+  cursor: pointer;
+`;