Merge pull request #178 from blaybus-hackathon/feat/caregiver-matching

Feat: connect api to care-giver profile update

Author: TakioN

src/pages/helper/Account/Account.jsx

@@ -7,6 +7,7 @@ import useScheduleStore from '@/store/suho/useScheduleStore';
 import { useHeaderPropsStore } from '@/store/useHeaderPropsStore';
 import useAuthStore from '@/store/useAuthStore';
 import useHelperAccountStore from '@/store/helper/useHelperAccoutStore';
+import useHelperLocationStore from '@/store/suho/useHelperLocationStore';
 // import { useAddressStore } from '@/store/useAddressStore';
 
 // ✅ 3. UI 컴포넌트 (공통 UI → 커스텀 컴포넌트 순)
@@ -20,27 +21,23 @@ import backarrow from '@/assets/images/back-arrow.png';
 import homecontrols from '@/assets/images/home-controls.png';
 import { DAYS } from '@/constants/days';
 
-//temp
-import useProfileStore from '@/store/useProfileStore';
-
 export default function Account() {
-  const { optimizedSchedule } = useScheduleStore();
+  const { updateSchedule } = useScheduleStore();
   const PAY_TYPES = ['시급', '일급', '주급'];
 
   const { user } = useAuthStore();
-  const { helper, setHelper } = useHelperAccountStore();
+  const { helper, setHelper, workTypeNames, setWorkTypeNames } = useHelperAccountStore();
+  const { addDistrict } = useHelperLocationStore();
   // const { getAddressNameById } = useAddressStore();
 
   const navigate = useNavigate();
 
-  const { profileEdit } = useProfileStore();
   const setHeaderProps = useHeaderPropsStore((state) => state.setHeaderProps);
   const clearHeaderProps = useHeaderPropsStore((state) => state.clearHeaderProps);
 
   const [afss, setAfss] = useState([]);
   const [asss, setAsss] = useState([]);
   const [atss, setAtss] = useState([]);
-  const [workTypes, setWorkTypes] = useState([]);
 
   useEffect(() => {
     setHeaderProps({
@@ -87,12 +84,19 @@ export default function Account() {
         const fetchedatss = await request('get', `/third/${location.asSeq}`);
         let third = fetchedatss.find((item) => item.id === location.atSeq);
         setAtss((prev) => [...prev, third.name]);
+
+        addDistrict(first.name, second.name, third.name);
+
+        for (let sch of helperInfo.helperWorkTime) {
+          updateSchedule(DAYS[sch.date - 1][0], 'start', sch.startTime);
+          updateSchedule(DAYS[sch.date - 1][0], 'end', sch.endTime);
+        }
       }
 
       const wtype = await request('post', '/cmn/part-request-care-list', {
         careTopEnumList: ['WORK_TYPE'],
       });
-      setWorkTypes(wtype.workTypeList);
+      setWorkTypeNames(getWorkType(wtype.workTypeList, helperInfo.workType).split(', '));
     } catch (e) {
       console.error('나의 정보를 가져오는데 실패했습니다 : ' + e);
     }
@@ -126,22 +130,20 @@ export default function Account() {
     ));
   };
 
-  const getWorkType = () => {
-    if (workTypes.length === 0) return;
-    const workTypeBit = helper.workType;
+  const getWorkType = (wtps, wtb) => {
+    if (!wtps) return;
     const res = [];
 
     for (let i = 0; i < 7; i++) {
       const mask = 1 << i;
-      if (workTypeBit & mask) {
+      if (wtb & mask) {
         res.push(mask);
       }
     }
 
-    return workTypes
-      .filter((x) => res.includes(x.careVal))
-      .map((y) => y.careName)
-      .join(', ');
+    const data = wtps.filter((x) => res.includes(x.careVal)).map((y) => y.careName);
+
+    return data.join(', ');
   };
 
   return (
@@ -181,7 +183,7 @@ export default function Account() {
             >
               <span
                 className={`
-      ${profileEdit.introduction ? 'text-[#191919]' : 'text-[#C8C8C8]'}
+      ${helper.introduce ? 'text-[#191919]' : 'text-[#C8C8C8]'}
        profile-section__content-text 
     `}
               >
@@ -244,12 +246,7 @@ export default function Account() {
 
             <div className='profile-section__content-box'>
               <img className='w-[24px] h-[24px]' src={homecontrols} alt='homeControls_icon' />
-              <span className='profile-section__content-text'>
-                {getWorkType()}
-                {/* {profileEdit.careTypes.workTypes.length > 0
-                  ? profileEdit.careTypes.workTypes.map((item) => item.label).join(', ')
-                  : '설정되지 않음'} */}
-              </span>
+              <span className='profile-section__content-text'>{workTypeNames.join(', ')}</span>
             </div>
           </section>
 

src/pages/helper/AccountEdit/AccountEdit.jsx

@@ -8,6 +8,7 @@ import useHelperLocationStore from '@/store/suho/useHelperLocationStore';
 import useScheduleStore from '@/store/suho/useScheduleStore';
 import usePayStore from '@/store/suho/usePayStore';
 import { useHeaderPropsStore } from '@/store/useHeaderPropsStore';
+import useHelperAccountStore from '@/store/helper/useHelperAccoutStore';
 
 // ✅ 3. UI 컴포넌트 (공통 UI → 커스텀 컴포넌트 순)
 import { Button } from '@/components/ui/custom/Button';
@@ -21,6 +22,7 @@ import BaseSection from '@/pages/helper/AccountEdit/BaseSection';
 import CertificateSection from '@/pages/helper/AccountEdit/CertificateSection';
 import PaySection from '@/pages/helper/AccountEdit/PaySection';
 import ScheduleSection from './ScheduleSection';
+import { request } from '@/api';
 
 export default function AccountEdit() {
   const navigate = useNavigate();
@@ -31,6 +33,7 @@ export default function AccountEdit() {
   const { pay } = usePayStore();
   const setHeaderProps = useHeaderPropsStore((state) => state.setHeaderProps);
   const clearHeaderProps = useHeaderPropsStore((state) => state.clearHeaderProps);
+  const { helper } = useHelperAccountStore();
 
   useEffect(() => {
     setHeaderProps({ type: 'back', title: '나의 계정' });
@@ -57,8 +60,33 @@ export default function AccountEdit() {
         // schedules: schedules,
       };
 
-      // 한 번에 저장
-      updateProfile(newProfile);
+      await request('put', '/helper/complete-profile', {
+        introduce: helper.introduce,
+        careExperience: helper.careExperience,
+        certificates: helper.certificates,
+        wage: helper.wage,
+        wageState: helper.wageState,
+        wageNegotiation: helper.wageNegotiation,
+        addressFirstIds: helper.helperWorkLocation.map((x) => x.afSeq),
+        addressSecondIds: helper.helperWorkLocation.map((x) => x.asSeq),
+        addressThirdIds: helper.helperWorkLocation.map((x) => x.atSeq),
+        workTimes: helper.helperWorkTime.map(({ date, startTime, endTime }) => ({
+          day: date,
+          startTime,
+          endTime,
+        })),
+        negotiation: helper.helperWorkTime[0].negotiation,
+        workTerm: +helper.helperWorkTime[0].workTerm[0],
+        careLevel: helper.careLevel,
+        inmateState: helper.inmateState,
+        workType: helper.workType,
+        careGender: helper.careGender,
+        serviceMeal: helper.serviceMeal,
+        serviceMobility: helper.serviceMobility,
+        serviceDaily: helper.serviceDaily,
+        verifyQnet: true,
+      });
+
       navigate('/helper/account');
     } catch (error) {
       console.error('프로필 저장 실패:', error);

src/pages/helper/AccountEdit/BaseSection.jsx

@@ -1,14 +1,12 @@
-import useProfileStore from '@/store/useProfileStore';
 import useHelperAccountStore from '@/store/helper/useHelperAccoutStore';
 
 function BaseSection() {
-  const { profileEdit, updateProfileField } = useProfileStore();
-  const { helper } = useHelperAccountStore();
+  const { helper, setPart } = useHelperAccountStore();
   return (
     <section className='flex items-center gap-12 '>
       <div className='relative w-24 h-24'>
         <img
-          src={profileEdit?.profileImage || '/defaultProfile.png'} // Zustand 상태 사용
+          src={helper?.img || '/defaultProfile.png'} // Zustand 상태 사용
           alt='profile_image'
           className='w-24 h-24 rounded-full bg-[#DCDCDC]'
         />
@@ -21,7 +19,7 @@ function BaseSection() {
             const file = e.target.files?.[0];
             if (file) {
               const imageUrl = URL.createObjectURL(file);
-              updateProfileField('profileImage', imageUrl);
+              setPart({ img: imageUrl });
             }
           }}
         />
@@ -41,10 +39,10 @@ function BaseSection() {
       </div>
       <div className='flex flex-col gap-5 items-start'>
         <span className='text-[#191919] text-[23px] font-bold leading-none h-auto '>
-          {helper.name || '홍길동'}
+          {helper.name}
         </span>
         <span className='text-[#191919] font-pretendard text-[20px] font-medium leading-none '>
-          {helper.addressDetail || '서울특별시 광진구'} 거주
+          {helper.addressDetail} 거주
         </span>
       </div>
     </section>

src/pages/helper/AccountEdit/CareTypeSection .jsx

@@ -1,34 +1,28 @@
-import { useNavigate } from "react-router-dom";
-import homecontrols from "@/assets/images/home-controls.png";
-import useProfileStore from "@/store/useProfileStore";
+import { useNavigate } from 'react-router-dom';
+import homecontrols from '@/assets/images/home-controls.png';
+import useProfileStore from '@/store/useProfileStore';
+import useHelperAccountStore from '@/store/helper/useHelperAccoutStore';
 
 const CareTypeSection = () => {
   const navigate = useNavigate();
   const { profileEdit } = useProfileStore(); // Zustand store에서 데이터 가져오기
+  const { workTypeNames } = useHelperAccountStore();
   const careTypeData = profileEdit.careTypes;
 
   return (
     <section
-      className=" helper-section hover:cursor-pointer"
-      onClick={() => navigate("/helper/account/care-type")}
+      className=' helper-section hover:cursor-pointer'
+      onClick={() => navigate('/helper/account/care-type')}
     >
-      <div className="flex flex-col items-start gap-2.5 self-stretch">
-        <span className="helper-title">나의 희망 돌봄유형</span>
-        <span className="helper-subtitle ">
-          내가 자신있는 돌봄 유형을 설정해 보세요!
-        </span>
+      <div className='flex flex-col items-start gap-2.5 self-stretch'>
+        <span className='helper-title'>나의 희망 돌봄유형</span>
+        <span className='helper-subtitle '>내가 자신있는 돌봄 유형을 설정해 보세요!</span>
       </div>
 
-      <div className="profile-section__content-box">
-        <img
-          className="w-[24px] h-[24px]"
-          src={homecontrols}
-          alt="homeControls_icon"
-        />
-        <span className="profile-section__content-text">
-          {careTypeData.workTypes.length > 0
-            ? careTypeData.workTypes.map((item) => item.label).join(", ")
-            : "설정되지 않음"}
+      <div className='profile-section__content-box'>
+        <img className='w-[24px] h-[24px]' src={homecontrols} alt='homeControls_icon' />
+        <span className='profile-section__content-text'>
+          {workTypeNames.length > 0 ? workTypeNames.join(', ') : '설정되지 않음'}
         </span>
       </div>
     </section>

src/pages/helper/AccountEdit/CareerSection.jsx

@@ -1,8 +1,8 @@
 import { Radio, RadioItem } from '@/components/ui/custom/multiRadio';
-import useProfileStore from '@/store/useProfileStore';
+import useHelperAccountStore from '@/store/helper/useHelperAccoutStore';
 
 const CareExperienceSelector = () => {
-  const { profileEdit, updateProfileField } = useProfileStore();
+  const { helper, setPart } = useHelperAccountStore();
 
   return (
     <section className='helper-section'>
@@ -12,15 +12,15 @@ const CareExperienceSelector = () => {
       </p>
 
       <Radio
-        onValueChange={(value) => updateProfileField('careExperience', value)}
+        onValueChange={(value) => setPart({ careExperience: value })}
         cols={2}
         className='flex items-center gap-8'
-        value={profileEdit.careExperience} // Zustand에서 직접 가져옴
+        value={helper.careExperience} // Zustand에서 직접 가져옴
       >
-        <RadioItem className='hover:cursor-pointer' value='신입'>
+        <RadioItem className='hover:cursor-pointer' value={false}>
           신입
         </RadioItem>
-        <RadioItem className='hover:cursor-pointer' value='경력'>
+        <RadioItem className='hover:cursor-pointer' value={true}>
           경력
         </RadioItem>
       </Radio>

src/pages/helper/AccountEdit/CertificateSection.jsx

@@ -5,20 +5,19 @@ import useHelperAccountStore from '@/store/helper/useHelperAccoutStore';
 
 const CertificationSection = () => {
   const { profileEdit, updateProfileField } = useProfileStore();
-  const { helper } = useHelperAccountStore();
+  const { helper, addCertificate, deleteCertificate } = useHelperAccountStore();
   const certificates = ['요양보호사', '간병사', '병원동행매니저', '산후관리사'];
 
   const handleRadioChange = (certificate, isChecked) => {
-    updateProfileField('selectedOptions', {
-      ...profileEdit.selectedOptions,
-      [certificate]: isChecked,
-    });
-    // 체크가 해제되면 해당 자격증 정보 입력 필드도 초기화 (선택 사항)
-    if (!isChecked && profileEdit.inputs[certificate]) {
-      updateProfileField('inputs', {
-        ...profileEdit.inputs,
-        [certificate]: '',
+    if (isChecked) {
+      addCertificate({
+        certName: certificate,
+        certNum: '',
+        certDateIssue: null,
+        certSerialNum: null,
       });
+    } else {
+      deleteCertificate(certificate);
     }
   };
 
@@ -38,7 +37,15 @@ const CertificationSection = () => {
 
       <Radio cols={1} multiple className='gap-4'>
         {certificates.map((certificate) => {
-          const isChecked = helper.certificates.includes(certificate);
+          let certNum = '';
+          const isChecked = helper.certificates.some(
+            (item) => item.certName.split(' ')[0] === certificate,
+          );
+          if (isChecked) {
+            certNum = helper.certificates.find(
+              (x) => x.certName.split(' ')[0] === certificate,
+            ).certNum;
+          }
           return (
             <div key={certificate} className='flex flex-col gap-2'>
               <RadioItem
@@ -52,7 +59,7 @@ const CertificationSection = () => {
                 <Input
                   type='text'
                   name={certificate}
-                  value={profileEdit.inputs[certificate] || ''}
+                  value={certNum}
                   onChange={handleInputChange} // event 객체 전달
                   placeholder={`${certificate} 자격증 정보를 입력하세요`}
                   className=''

src/pages/helper/AccountEdit/IntroSection.jsx

@@ -1,12 +1,13 @@
 import { useRef } from 'react';
-import useProfileStore from '@/store/useProfileStore';
+import useHelperAccountStore from '@/store/helper/useHelperAccoutStore';
 const IntroductionInput = () => {
   const INTRODUCTIONMAX = 75; // 소개 최대 글자 수
-  const { profileEdit, updateProfileField } = useProfileStore();
+  const { helper, setPart } = useHelperAccountStore();
   const textareaRef = useRef(null);
 
   const handleInput = (e) => {
-    updateProfileField('introduction', e.target.value);
+    // updateProfileField('introduction', e.target.value);
+    setPart({ introduce: e.target.value });
 
     const el = textareaRef.current;
     if (el) {
@@ -25,7 +26,7 @@ const IntroductionInput = () => {
       </p>
       <textarea
         ref={textareaRef}
-        value={profileEdit.introduction}
+        value={helper.introduce}
         onInput={handleInput}
         placeholder='예) 한 사람, 한 사람의 필요에 맞춰 따뜻하고 세심한 돌봄을 제공하는 요양사입니다.'
         className='

src/pages/helper/AccountEdit/LocationSection.jsx

@@ -17,14 +17,14 @@ function LocationSection({ selectedDistricts }) {
 
       <div className='profile-section__content-box'>
         <img className='w-[24px] h-[24px]' src={location_icon} alt='location_icon' />
-        <div className='flex items-center gap-1 py-1'>
+        <div className='flex items-center gap-1 py-1 w-full'>
           {Object.entries(selectedDistricts).length > 0 ? (
-            <span className='flex flex-col gap-3'>
+            <span className='flex flex-col gap-3 w-full'>
               {Object.entries(selectedDistricts).map(([city, districts]) =>
                 Object.entries(districts).map(([district, subDistricts]) => (
                   <div
                     key={`${city}-${district}`}
-                    className='flex gap-1 profile-section__content-text'
+                    className='flex gap-1 profile-section__content-text w-full items-center'
                   >
                     <span className='flex-1'>{city.length > 4 ? city.slice(0, 2) : city}</span>
                     <img