Feat: 북마크 기능 추가 (#33)

* test: 테스크 로그 코드 삭제

* feat: 추천 주택 UI 구현

* Add files via upload

* Create frontend-ci-cd.yml

* Delete workflows directory

* Update frontend-ci-cd.yml

* Create deploy.yml

* Update frontend-ci-cd.yml

* Update frontend-ci-cd.yml

* feat: 자가진단 지원 가능 유형에 맞는 공고 목록 ui 구현

* feat: 추전 주택 정보가 지도에 표시되도록 확장

* feat: 지원가능 목록에도 필터링 적용

* refactor: 좌우 스크롤 목록 ui를 분리

* feat: 북마크 로직, ui 구현

* design: 카카오맵 커스텀 오버레이 ui에 북마크 삭제, 너비 수정

* feat: 수평 카드 스크롤러에 값이 없을때 기본 레이아웃 emptyConfig 설정

* test: 테스트 코드 삭제

* remove: 더미 파일 삭제

* feat: 마이페이지에 북마크 한 공고 목록 구현

---------

Co-authored-by: HyeIn Jeong <150007915+Ahranah@users.noreply.github.com>

Author: doongeon

src/api/bookmardApi.js

@@ -0,0 +1,68 @@
+// api/bookmarkService.js
+import axios from 'axios';
+
+const BOOKMARK_API_URL = '/api/api/bookmark';
+
+// 즐겨찾기 목록 조회
+export const getBookmarks = async (token) => {
+  try {
+    const response = await axios.get(BOOKMARK_API_URL, {
+      headers: { Authorization: `Bearer ${token}` },
+    });
+    return response.data;
+  } catch (error) {
+    console.error('즐겨찾기 목록 조회 실패:', error);
+    throw error;
+  }
+};
+
+// 즐겨찾기 추가
+export const addBookmark = async (bookmarkData, token) => {
+  try {
+    const response = await axios.post(BOOKMARK_API_URL, bookmarkData, {
+      headers: { Authorization: `Bearer ${token}` },
+    });
+    return response.data;
+  } catch (error) {
+    console.error('즐겨찾기 추가 실패:', error);
+    throw error;
+  }
+};
+
+// 즐겨찾기 삭제
+export const removeBookmark = async (bookmarkData, token) => {
+  try {
+    const response = await axios.delete(BOOKMARK_API_URL, {
+      data: bookmarkData,
+      headers: { Authorization: `Bearer ${token}` },
+    });
+    return response.data;
+  } catch (error) {
+    console.error('즐겨찾기 삭제 실패:', error);
+    throw error;
+  }
+};
+
+// 즐겨찾기 토글 (추가/삭제 자동 판별)
+export const toggleBookmark = async (
+  danziId,
+  userId,
+  token,
+  currentFavorites
+) => {
+  const bookmarkData = { userId, danziId };
+  const isCurrentlyFavorited = currentFavorites.some(
+    (fav) => fav.danziId === danziId
+  );
+
+  try {
+    if (isCurrentlyFavorited) {
+      return await removeBookmark(bookmarkData, token);
+    } else {
+      return await addBookmark(bookmarkData, token);
+    }
+  } catch (error) {
+    console.error('즐겨찾기 토글 실패:', error);
+    throw error;
+  }
+};

src/components/KakaoMapViewer.vue

@@ -73,9 +73,9 @@ const placesSearchCB = (data, status, pagination) => {
   if (status === window.kakao.maps.services.Status.OK) {
     displayPlaces(data);
   } else if (status === window.kakao.maps.services.Status.ZERO_RESULT) {
-    console.warn('검색 결과가 없습니다.');
+    // console.warn('검색 결과가 없습니다.');
   } else if (status === window.kakao.maps.services.Status.ERROR) {
-    console.error('장소 검색 중 오류가 발생했습니다.');
+    // console.error('장소 검색 중 오류가 발생했습니다.');
   }
 };
 
@@ -119,8 +119,6 @@ const displayPlaces = (placesData) => {
 watch(
   () => props.houses,
   (newHouses) => {
-    console.log('  ⚠️  : ', newHouses);
-
     if (!map.value) return;
 
     if (newHouses.length > 0) {
@@ -151,8 +149,6 @@ const loadAllComplexes = async () => {
     await geocodeComplex(house, bounds);
   }
 
-  console.log('  ⚠️  : ', bounds);
-
   if (markers.value.length === 1) {
     // 마커가 하나뿐인 경우 해당 위치로 이동하고 적절한 줌 레벨 설정
     const marker = markers.value[0];
@@ -254,7 +250,7 @@ const geocodeDetailedAddress = (
 
       if (callback) callback(markerData);
     } else {
-      console.warn(`주소 검색 실패: ${fullAddress} (${status})`);
+      // console.warn(`주소 검색 실패: ${fullAddress} (${status})`);
       // 첫 번째 시도 실패 시 두 번째 시도
       if (attempt === 0) {
         geocodeDetailedAddress(house, 1, searchFacilities, callback);
@@ -298,8 +294,6 @@ const updateMapWithHouse = (house) => {
         existingMarker.lng
       );
 
-      console.log('  ⚠️  : ', '지도 변경');
-
       map.value.setCenter(newLatLng);
       map.value.setLevel(5);
       selectedMarker.value = existingMarker;
@@ -318,7 +312,6 @@ const onLoadKakaoMap = (newMap) => {
 
 // 인포윈도우 열기 (LH 단지) - 레거시
 const openComplexInfowindow = (marker) => {
-  console.log('LH 단지 마커 클릭:', marker);
   selectedMarker.value = marker;
 };