Skip to content

Commit

Permalink
Merge branch 'develop'
Browse files Browse the repository at this point in the history
  • Loading branch information
은지 committed Aug 24, 2024
2 parents 9b005f0 + 1f1faa1 commit c98878f
Show file tree
Hide file tree
Showing 3 changed files with 139 additions and 115 deletions.
12 changes: 9 additions & 3 deletions src/Components/Detail/CompanyDetail/Basic/index.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -15,15 +15,13 @@ export function CompanyDetailBasic({
setCanEdit,
}: PropsType) {
const navigate = useNavigate();

const nameArray = decodeURI(companyDetailInfo?.biz_registration_url).split(
'/'
);
const { mutate: downloadFile } = useDownloadData({
fileName: nameArray[nameArray.length - 1].substring(37),
fileUrl: companyDetailInfo?.biz_registration_url,
});

return (
<_.Container>
<_.Wrapper>
Expand All @@ -36,7 +34,15 @@ export function CompanyDetailBasic({
</_.BackWrapper>
<_.LogoWrapper>
<_.CompanyLogo
src={`${process.env.REACT_APP_FILE_URL}${companyDetailInfo?.company_profile_url}`}
src={
!!companyDetailInfo &&
`${
process.env.REACT_APP_FILE_URL
}${companyDetailInfo?.company_profile_url.replace(
/\s+/g,
''
)}`
}
/>
</_.LogoWrapper>
</Stack>
Expand Down
76 changes: 46 additions & 30 deletions src/Components/Detail/CompanyDetail/Edit/index.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,8 +11,9 @@ import { useForm } from '../../../../Hooks/useForm';
import * as _ from '../../style';
import { CompanyInfoEditType } from '../../../../Apis/Companies/request';
import { useChangeCompanyInfo } from '../../../../Apis/Companies';
import { useFileUpload } from '../../../../Apis/File';
import { useNavigate } from 'react-router-dom';
import { usePresignedUrl } from '../../../../Apis/Files';
import { useQueryClient } from 'react-query';

interface PropsType {
companyDetailInfo: CompanyDetailResponse;
Expand All @@ -28,7 +29,14 @@ export function CompanyDetailEdit({
const navigate = useNavigate();
const { append } = useToastStore();
const fileInput = useRef<HTMLInputElement>(null);
const [file, setFile] = useState<File | null>(null);

const [imageUrl, setImageUrl] = useState<string | null>(
`${process.env.REACT_APP_FILE_URL}${companyDetailInfo?.company_profile_url}` ||
null
);

const [selectedFile, setSelectedFile] = useState<File | null>(null);

const {
form: companyDetailEditInfo,
setForm: setCompanyDetailEditInfo,
Expand Down Expand Up @@ -76,6 +84,7 @@ export function CompanyDetailEdit({
representative_phone_no,
} = companyDetailEditInfo;

const queryClient = useQueryClient();
const { mutate: editCompanyInfo } = useChangeCompanyInfo(
companyDetailEditInfo,
{
Expand All @@ -87,6 +96,9 @@ export function CompanyDetailEdit({
});
refetchCompanyDetailInfo();
setCanEdit(false);
queryClient.invalidateQueries({
queryKey: ['editCompanyInfo'],
});
},
onError: () => {
append({
Expand All @@ -98,26 +110,38 @@ export function CompanyDetailEdit({
}
);

const { mutate: fileUploader } = useFileUpload(file!, {
onSuccess: (res: any) => {
setCompanyDetailEditInfo((companyDetailEditInfo) => ({
...companyDetailEditInfo,
company_profile_url: res.data?.urls[0],
}));
setTimeout(editCompanyInfo);
},
onError: () => {
append({
title: '파일 업로드에 실패하였습니다.',
message: '',
type: 'RED',
});
},
});
const { mutateAsync: getPresignedUrl } = usePresignedUrl();

const handleFileUploadAndEdit = async () => {
if (selectedFile) {
const response = await getPresignedUrl([selectedFile]);
if (response?.presignedUrls?.urls?.[0]?.file_path) {
const uploadedUrl = `${process.env.REACT_APP_FILE_URL}${response.presignedUrls.urls[0].file_path}`;
setImageUrl(uploadedUrl);
setCompanyDetailEditInfo((companyDetailEditInfo) => ({
...companyDetailEditInfo,
company_profile_url:
response.presignedUrls.urls[0].file_path,
}));
setTimeout(() => {
editCompanyInfo();
}, 500);
}
}
};

const handleFileChange = (event: React.ChangeEvent<HTMLInputElement>) => {
if (event.target.files && event.target.files.length > 0) {
const file = event.target.files[0];
setSelectedFile(file);
const fileUrl = URL.createObjectURL(file);
setImageUrl(fileUrl);
}
};

const submitEditCompanyInfo = () => {
if (file) {
fileUploader();
if (selectedFile) {
handleFileUploadAndEdit();
} else {
editCompanyInfo();
}
Expand All @@ -134,13 +158,7 @@ export function CompanyDetailEdit({
</Text>
</_.BackWrapper>
<_.LogoWrapper>
<_.CompanyLogo
src={
file
? URL.createObjectURL(file)
: `${process.env.REACT_APP_FILE_URL}${companyDetailInfo?.company_profile_url}`
}
/>
<_.CompanyLogo src={imageUrl || ''} />
</_.LogoWrapper>
<_.LogoEditImg
onClick={() => {
Expand All @@ -154,9 +172,7 @@ export function CompanyDetailEdit({
hidden
ref={fileInput}
accept="image/jpg, image/png"
onChange={(e) => {
setFile(e.target.files ? e.target.files[0] : null);
}}
onChange={handleFileChange}
/>
</_.LogoEditWrapper>
<Stack gap={20}>
Expand Down
166 changes: 84 additions & 82 deletions src/Components/Detail/RecruitmentFormDetail/Basic/index.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -9,11 +9,13 @@ interface PropsType {
recruitmentFormDetail: RecruitmentFormDetailResponse;
setCanEdit: Dispatch<SetStateAction<boolean>>;
}

export function RecruitmentFormDetailBasic({
recruitmentFormDetail,
setCanEdit,
}: PropsType) {
const navigate = useNavigate();

return (
<_.Container>
<_.Wrapper>
Expand Down Expand Up @@ -46,6 +48,7 @@ export function RecruitmentFormDetailBasic({
</Button>
</Stack>
</_.Wrapper>

<_.Stack>
<_.TitleBox>기업명</_.TitleBox>
<_.ContentBox width={40}>
Expand All @@ -64,82 +67,80 @@ export function RecruitmentFormDetailBasic({
: '상시모집'}
</_.ContentBox>
</_.Stack>

<_.Stack>
<_.TitleBox height={recruitmentFormDetail?.areas.length * 325}>
모집분야
</_.TitleBox>
<_.Stack flexDirection="column" width={90}>
{recruitmentFormDetail?.areas.map((area, i) => {
return (
<_.Stack key={area.id}>
<_.TitleBox height={325} width={5}>
{i + 1}
</_.TitleBox>
<_.Stack flexDirection="column" width={95}>
<_.Stack>
<_.TitleBox height={125}>
채용인원
</_.TitleBox>
<_.ContentBox height={125} width={15}>
{area.hiring}명
</_.ContentBox>
<_.TitleBox height={125}>
분야
</_.TitleBox>
<_.ContentBox
height={125}
width={15}
overflow="scroll"
longText={true}
>
{area.job
.map((item) => item.name)
.join(' / ')}
</_.ContentBox>
<_.TitleBox height={125}>
사용기술
</_.TitleBox>
<_.ContentBox
height={125}
width={40}
overflow="scroll"
longText={true}
>
{area.tech
.map((item) => item.name)
.join(' / ')}
</_.ContentBox>
</_.Stack>
<_.Stack>
<_.TitleBox height={200}>
주요업무
</_.TitleBox>
<_.ContentBox
height={200}
width={40}
longText={true}
overflow="scroll"
>
{area.major_task}
</_.ContentBox>
<_.TitleBox height={200}>
우대사항
</_.TitleBox>
<_.ContentBox
height={200}
width={40}
longText={true}
overflow="scroll"
>
{area.preferential_treatment || '-'}
</_.ContentBox>
</_.Stack>
{recruitmentFormDetail?.areas.map((area, i) => (
<_.Stack key={area.id}>
<_.TitleBox height={325} width={5}>
{i + 1}
</_.TitleBox>
<_.Stack flexDirection="column" width={95}>
<_.Stack>
<_.TitleBox height={125}>
채용인원
</_.TitleBox>
<_.ContentBox height={125} width={15}>
{area.hiring}명
</_.ContentBox>
<_.TitleBox height={125}>분야</_.TitleBox>
<_.ContentBox
height={125}
width={15}
overflow="scroll"
longText={true}
>
{area.job
.map((item) => item.name)
.join(' / ')}
</_.ContentBox>
<_.TitleBox height={125}>
사용기술
</_.TitleBox>
<_.ContentBox
height={125}
width={40}
overflow="scroll"
longText={true}
>
{area.tech
.map((item) => item.name)
.join(' / ')}
</_.ContentBox>
</_.Stack>
<_.Stack>
<_.TitleBox height={200}>
주요업무
</_.TitleBox>
<_.ContentBox
height={200}
width={40}
longText={true}
overflow="scroll"
>
{area.major_task}
</_.ContentBox>
<_.TitleBox height={200}>
우대사항
</_.TitleBox>
<_.ContentBox
height={200}
width={40}
longText={true}
overflow="scroll"
>
{area.preferential_treatment || '-'}
</_.ContentBox>
</_.Stack>
</_.Stack>
);
})}
</_.Stack>
))}
</_.Stack>
</_.Stack>

<_.Stack>
<_.TitleBox>자격요건</_.TitleBox>
<_.Stack flexDirection="column" width={90}>
Expand All @@ -158,14 +159,14 @@ export function RecruitmentFormDetailBasic({
<_.TitleBox>성적</_.TitleBox>
<_.ContentBox width={20}>
{recruitmentFormDetail?.required_grade
? recruitmentFormDetail?.required_grade +
'%'
? `${recruitmentFormDetail?.required_grade}%`
: '-'}
</_.ContentBox>
</_.Stack>
</_.Stack>
</_.Stack>
</_.Stack>

<_.Stack>
<_.TitleBox height={275}>근무조건</_.TitleBox>
<_.Stack flexDirection="column" width={90}>
Expand All @@ -188,7 +189,7 @@ export function RecruitmentFormDetailBasic({
<_.TitleBox>정규직전환시</_.TitleBox>
<_.ContentBox width={24}>
{recruitmentFormDetail?.pay
? `${recruitmentFormDetail?.pay?.replace(
? `${recruitmentFormDetail?.pay.replace(
/\B(?=(\d{3})+(?!\d))/g,
','
)}만원/연`
Expand All @@ -208,25 +209,26 @@ export function RecruitmentFormDetailBasic({
</_.Stack>
</_.Stack>
</_.Stack>

<_.Stack>
<_.TitleBox height={350}>채용절차</_.TitleBox>
<_.Stack flexDirection="column" width={90}>
<_.Stack flexDirection="column" width={100}>
<_.Stack>
<_.TitleBox>채용절차</_.TitleBox>
<_.ContentBox width={60}>
{recruitmentFormDetail?.hiring_progress.map(
(progress, i) => {
if (
recruitmentFormDetail
?.hiring_progress.length ===
i + 1
) {
return `${hiringProgress[progress]}`;
}
return `${hiringProgress[progress]} → `;
}
)}
{recruitmentFormDetail?.hiring_progress
.map(
(progress, i) =>
`${hiringProgress[progress]}${
recruitmentFormDetail
.hiring_progress.length !==
i + 1
? ' → '
: ''
}`
)
.join('')}
</_.ContentBox>
<_.TitleBox>
병역특례
Expand Down

0 comments on commit c98878f

Please sign in to comment.