diff --git a/src/services/api.js b/src/services/api.js
index b4efbef..9273a97 100644
--- a/src/services/api.js
+++ b/src/services/api.js
@@ -6,6 +6,7 @@ const getApiUrls = () => {
   const config = window.__runtime_config__ || {}
   return {
     GATEWAY_URL: config.GATEWAY_URL || 'http://20.1.2.3',
+<<<<<<< HEAD
     AUTH_URL: config.AUTH_URL || 'http://localhost:8081/api/auth',
     MEMBER_URL: config.MEMBER_URL || 'http://localhost:8081/api/member',
     STORE_URL: config.STORE_URL || 'http://localhost:8082/api/store',
@@ -15,6 +16,15 @@ const getApiUrls = () => {
     SALES_URL: config.SALES_URL || 'http://localhost:8082/api/sales',
     // ⚠️ 수정: 추천 API는 ai-recommend 서비스 (포트 8084)
     RECOMMEND_URL: config.RECOMMEND_URL || 'http://localhost:8084/api/recommendations',
+=======
+    AUTH_URL: 'http://localhost:8081/api/auth',
+    MEMBER_URL: 'http://localhost:8081/api/member',
+    STORE_URL: config.STORE_URL || 'http://localhost:8082/api/store',
+    CONTENT_URL: config.CONTENT_URL || 'http://20.1.2.3/api/content',
+    MENU_URL: config.MENU_URL || 'http://localhost:8082/api/menu',
+    SALES_URL: config.SALES_URL || 'http://localhost:8082/api/sales',
+    RECOMMEND_URL: config.RECOMMEND_URL || 'http://20.1.2.3/api/recommendation',
+>>>>>>> 87871709f2bbcdab5df004a3954d6ba0af3cadce
   }
 }
 
diff --git a/src/services/menu.js b/src/services/menu.js
new file mode 100644
index 0000000..d911e78
--- /dev/null
+++ b/src/services/menu.js
@@ -0,0 +1,210 @@
+// src/services/menu.js - 메뉴 관련 API 서비스
+import { menuApi, handleApiError, formatSuccessResponse } from './api.js'
+
+/**
+ * 메뉴 관련 API 서비스
+ * 백엔드 Menu Controller와 연동 (포트 8082)
+ */
+class MenuService {
+  /**
+   * 메뉴 목록 조회
+   * @param {number} storeId - 매장 ID
+   * @returns {Promise<Object>} 메뉴 목록
+   */
+  async getMenus(storeId) {
+    try {
+      console.log('=== 메뉴 목록 조회 API 호출 ===')
+      console.log('매장 ID:', storeId)
+      
+      if (!storeId) {
+        throw new Error('매장 ID가 필요합니다')
+      }
+      
+      // GET /api/menu?storeId={storeId}
+      const response = await menuApi.get('', {
+        params: { storeId }
+      })
+      
+      console.log('메뉴 목록 조회 API 응답:', response.data)
+      
+      if (response.data && response.data.status === 200) {
+        return formatSuccessResponse(response.data.data, '메뉴 목록을 조회했습니다.')
+      } else {
+        throw new Error(response.data.message || '메뉴 목록을 찾을 수 없습니다.')
+      }
+    } catch (error) {
+      console.error('메뉴 목록 조회 실패:', error)
+      
+      // 404 오류 또는 네트워크 오류 시 빈 배열 반환 (개발 중)
+      if (error.response?.status === 404 || 
+          error.code === 'ECONNREFUSED' || 
+          error.message.includes('Network Error')) {
+        console.warn('백엔드 미구현 또는 네트워크 오류 - 빈 메뉴 목록 반환')
+        return formatSuccessResponse([], '메뉴 목록이 비어있습니다.')
+      }
+      
+      return handleApiError(error)
+    }
+  }
+
+  /**
+   * 메뉴 상세 조회
+   * @param {number} menuId - 메뉴 ID
+   * @returns {Promise<Object>} 메뉴 상세 정보
+   */
+  async getMenuDetail(menuId) {
+    try {
+      console.log('=== 메뉴 상세 조회 API 호출 ===')
+      console.log('메뉴 ID:', menuId)
+      
+      if (!menuId || menuId === 'undefined') {
+        throw new Error('올바른 메뉴 ID가 필요합니다')
+      }
+      
+      const numericMenuId = parseInt(menuId)
+      if (isNaN(numericMenuId)) {
+        throw new Error('메뉴 ID는 숫자여야 합니다')
+      }
+      
+      // GET /api/menu/{menuId}
+      const response = await menuApi.get(`/${numericMenuId}`)
+      
+      console.log('메뉴 상세 조회 API 응답:', response.data)
+      
+      if (response.data && response.data.status === 200) {
+        return formatSuccessResponse(response.data.data, '메뉴 상세 정보를 조회했습니다.')
+      } else {
+        throw new Error(response.data.message || '메뉴를 찾을 수 없습니다.')
+      }
+    } catch (error) {
+      console.error('메뉴 상세 조회 실패:', error)
+      return handleApiError(error)
+    }
+  }
+
+  /**
+   * 메뉴 등록
+   * @param {Object} menuData - 메뉴 정보
+   * @returns {Promise<Object>} 등록 결과
+   */
+  async createMenu(menuData) {
+    try {
+      console.log('=== 메뉴 등록 API 호출 ===')
+      console.log('요청 데이터:', menuData)
+      
+      const requestData = {
+        storeId: menuData.storeId,
+        menuName: menuData.menuName,
+        category: menuData.category,
+        price: parseInt(menuData.price) || 0,
+        description: menuData.description || ''
+      }
+      
+      console.log('백엔드 전송 데이터:', requestData)
+      
+      // POST /api/menu/register
+      const response = await menuApi.post('/register', requestData)
+      
+      console.log('메뉴 등록 API 응답:', response.data)
+      
+      if (response.data && response.data.status === 200) {
+        return formatSuccessResponse(response.data.data, '메뉴가 성공적으로 등록되었습니다.')
+      } else {
+        throw new Error(response.data.message || '메뉴 등록에 실패했습니다.')
+      }
+    } catch (error) {
+      console.error('메뉴 등록 실패:', error)
+      return handleApiError(error)
+    }
+  }
+
+  /**
+   * 메뉴 수정
+   * @param {number} menuId - 메뉴 ID
+   * @param {Object} menuData - 수정할 메뉴 정보
+   * @returns {Promise<Object>} 수정 결과
+   */
+  async updateMenu(menuId, menuData) {
+    try {
+      console.log('=== 메뉴 수정 API 호출 ===')
+      console.log('메뉴 ID:', menuId)
+      console.log('수정 데이터:', menuData)
+      
+      if (!menuId || menuId === 'undefined') {
+        throw new Error('올바른 메뉴 ID가 필요합니다')
+      }
+      
+      const numericMenuId = parseInt(menuId)
+      if (isNaN(numericMenuId)) {
+        throw new Error('메뉴 ID는 숫자여야 합니다')
+      }
+      
+      const requestData = {
+        menuName: menuData.menuName,
+        category: menuData.category,
+        price: parseInt(menuData.price) || 0,
+        description: menuData.description || ''
+      }
+      
+      console.log('백엔드 전송 데이터:', requestData)
+      
+      // PUT /api/menu/{menuId}
+      const response = await menuApi.put(`/${numericMenuId}`, requestData)
+      
+      console.log('메뉴 수정 API 응답:', response.data)
+      
+      if (response.data && response.data.status === 200) {
+        return formatSuccessResponse(response.data.data, '메뉴가 성공적으로 수정되었습니다.')
+      } else {
+        throw new Error(response.data.message || '메뉴 수정에 실패했습니다.')
+      }
+    } catch (error) {
+      console.error('메뉴 수정 실패:', error)
+      return handleApiError(error)
+    }
+  }
+
+  /**
+   * 메뉴 삭제
+   * @param {number} menuId - 메뉴 ID
+   * @returns {Promise<Object>} 삭제 결과
+   */
+  async deleteMenu(menuId) {
+    try {
+      console.log('=== 메뉴 삭제 API 호출 ===')
+      console.log('메뉴 ID:', menuId)
+      
+      if (!menuId || menuId === 'undefined') {
+        throw new Error('올바른 메뉴 ID가 필요합니다')
+      }
+      
+      const numericMenuId = parseInt(menuId)
+      if (isNaN(numericMenuId)) {
+        throw new Error('메뉴 ID는 숫자여야 합니다')
+      }
+      
+      // DELETE /api/menu/{menuId}
+      const response = await menuApi.delete(`/${numericMenuId}`)
+      
+      console.log('메뉴 삭제 API 응답:', response.data)
+      
+      if (response.data && response.data.status === 200) {
+        return formatSuccessResponse(response.data.data, '메뉴가 성공적으로 삭제되었습니다.')
+      } else {
+        throw new Error(response.data.message || '메뉴 삭제에 실패했습니다.')
+      }
+    } catch (error) {
+      console.error('메뉴 삭제 실패:', error)
+      return handleApiError(error)
+    }
+  }
+}
+
+// 싱글톤 인스턴스 생성 및 export
+export const menuService = new MenuService()
+export default menuService
+
+// 디버깅을 위한 전역 노출 (개발 환경에서만)
+if (process.env.NODE_ENV === 'development') {
+  window.menuService = menuService
+}
\ No newline at end of file
diff --git a/src/services/store.js b/src/services/store.js
index 57916ba..8a0a997 100644
--- a/src/services/store.js
+++ b/src/services/store.js
@@ -1,9 +1,18 @@
+<<<<<<< HEAD
 //* src/services/store.js - 매출 API 수정버전
 import { storeApi, salesApi, handleApiError, formatSuccessResponse } from './api.js'
 
 /**
  * 매장 관련 API 서비스
  * 유저스토리: STR-005, STR-010, STR-015, STR-020, STR-025, STR-030, STR-035, STR-040
+=======
+//* src/services/store.js - 매장 서비스 완전 수정
+import { storeApi, handleApiError, formatSuccessResponse } from './api.js'
+
+/**
+ * 매장 관련 API 서비스
+ * 백엔드 Store Controller와 연동 (포트 8082)
+>>>>>>> 87871709f2bbcdab5df004a3954d6ba0af3cadce
  */
 class StoreService {
   /**
@@ -13,12 +22,17 @@ class StoreService {
    */
   async registerStore(storeData) {
     try {
-      const response = await storeApi.post('/register', {
+      console.log('=== 매장 등록 API 호출 ===')
+      console.log('요청 데이터:', storeData)
+      
+      // 백엔드 StoreCreateRequest에 맞는 형태로 변환
+      const requestData = {
         storeName: storeData.storeName,
         storeImage: storeData.storeImage,
         businessType: storeData.businessType,
         address: storeData.address,
         phoneNumber: storeData.phoneNumber,
+<<<<<<< HEAD
         businessNumber: storeData.businessNumber,
         instaAccounts: storeData.instaAccounts,
         blogAccounts: storeData.blogAccounts,
@@ -29,7 +43,46 @@ class StoreService {
       })
 
       return formatSuccessResponse(response.data.data, '매장이 등록되었습니다.')
+=======
+        businessHours: storeData.businessHours,
+        closedDays: storeData.closedDays,
+        seatCount: parseInt(storeData.seatCount) || 0,
+        instaAccounts: storeData.instaAccounts || '',
+        blogAccounts: storeData.blogAccounts || '',
+        description: storeData.description || ''
+      }
+      
+      console.log('=== 각 필드 상세 검증 ===')
+      console.log('storeName:', requestData.storeName, '(타입:', typeof requestData.storeName, ')')
+      console.log('businessType:', requestData.businessType, '(타입:', typeof requestData.businessType, ')')
+      console.log('address:', requestData.address, '(타입:', typeof requestData.address, ')')
+      console.log('seatCount:', requestData.seatCount, '(타입:', typeof requestData.seatCount, ')')
+      
+      console.log('백엔드 전송 데이터:', requestData)
+      
+      const response = await storeApi.post('/register', requestData)
+      
+      console.log('매장 등록 API 응답:', response.data)
+      
+      // 백엔드 응답 구조에 맞게 처리
+      if (response.data && (response.data.status === 200 || response.data.success !== false)) {
+        return {
+          success: true,
+          message: response.data.message || '매장이 등록되었습니다.',
+          data: response.data.data
+        }
+      } else {
+        throw new Error(response.data.message || '매장 등록에 실패했습니다.')
+      }
+>>>>>>> 87871709f2bbcdab5df004a3954d6ba0af3cadce
     } catch (error) {
+      console.error('매장 등록 실패:', error)
+      
+      if (error.response) {
+        console.error('응답 상태:', error.response.status)
+        console.error('응답 데이터:', error.response.data)
+      }
+      
       return handleApiError(error)
     }
   }
@@ -40,37 +93,125 @@ class StoreService {
    */
   async getStore() {
     try {
-      const response = await storeApi.get('/')
-
-      return formatSuccessResponse(response.data.data, '매장 정보를 조회했습니다.')
+      console.log('=== 매장 정보 조회 API 호출 ===')
+      
+      // URL 슬래시 문제 해결: 빈 문자열로 호출하여 '/api/store'가 되도록 함
+      const response = await storeApi.get('')
+      
+      console.log('매장 정보 조회 API 응답:', response.data)
+      
+      // 백엔드 응답 구조 수정: 디버깅 결과에 맞게 처리
+      if (response.data && response.data.status === 200 && response.data.data) {
+        console.log('✅ 매장 정보 조회 성공:', response.data.data)
+        return {
+          success: true,
+          message: response.data.message || '매장 정보를 조회했습니다.',
+          data: response.data.data
+        }
+      } else if (response.data && response.data.status === 404) {
+        // 매장이 없는 경우
+        console.log('⚠️ 등록된 매장이 없음')
+        return {
+          success: false,
+          message: '등록된 매장이 없습니다',
+          data: null
+        }
+      } else {
+        console.warn('예상치 못한 응답 구조:', response.data)
+        throw new Error(response.data.message || '매장 정보를 찾을 수 없습니다.')
+      }
     } catch (error) {
+      console.error('매장 정보 조회 실패:', error)
+      
+      // 404 오류 처리 (매장이 없음)
+      if (error.response?.status === 404) {
+        return {
+          success: false,
+          message: '등록된 매장이 없습니다',
+          data: null
+        }
+      }
+      
+      // 500 오류 처리 (서버 내부 오류)
+      if (error.response?.status === 500) {
+        console.error('서버 내부 오류 - 백엔드 로그 확인 필요:', error.response?.data)
+        return {
+          success: false,
+          message: '서버 오류가 발생했습니다. 관리자에게 문의하세요.',
+          data: null
+        }
+      }
+      
       return handleApiError(error)
     }
   }
 
   /**
    * 매장 정보 수정 (STR-010: 매장 수정)
+   * @param {number} storeId - 매장 ID (현재는 사용하지 않음 - JWT에서 사용자 확인)
    * @param {Object} storeData - 수정할 매장 정보
    * @returns {Promise<Object>} 매장 수정 결과
    */
-  async updateStore(storeData) {
+  async updateStore(storeId, storeData) {
     try {
+<<<<<<< HEAD
       const response = await storeApi.put('/', storeData)
 
       return formatSuccessResponse(response.data.data, '매장 정보가 수정되었습니다.')
+=======
+      console.log('=== 매장 정보 수정 API 호출 ===')
+      console.log('요청 데이터:', storeData)
+      
+      // 백엔드 StoreUpdateRequest에 맞는 형태로 변환
+      const requestData = {
+        storeName: storeData.storeName,
+        businessType: storeData.businessType,
+        address: storeData.address,
+        phoneNumber: storeData.phoneNumber,
+        businessHours: storeData.businessHours,
+        closedDays: storeData.closedDays,
+        seatCount: parseInt(storeData.seatCount) || 0,
+        instaAccounts: storeData.instaAccounts || '',
+        blogAccounts: storeData.blogAccounts || '',
+        description: storeData.description || ''
+      }
+      
+      console.log('백엔드 전송 데이터:', requestData)
+      
+      // PUT 요청 (storeId는 JWT에서 추출하므로 URL에 포함하지 않음)
+      const response = await storeApi.put('/', requestData)
+      
+      console.log('매장 정보 수정 API 응답:', response.data)
+      
+      if (response.data && (response.data.status === 200 || response.data.success !== false)) {
+        return {
+          success: true,
+          message: response.data.message || '매장 정보가 수정되었습니다.',
+          data: response.data.data
+        }
+      } else {
+        throw new Error(response.data.message || '매장 정보 수정에 실패했습니다.')
+      }
+>>>>>>> 87871709f2bbcdab5df004a3954d6ba0af3cadce
     } catch (error) {
+      console.error('매장 정보 수정 실패:', error)
       return handleApiError(error)
     }
   }
 
   /**
    * 매출 정보 조회 (STR-020: 대시보드)
+<<<<<<< HEAD
    * ⚠️ 수정: salesApi 사용하고 storeId 매개변수 추가
    * @param {number} storeId - 매장 ID
+=======
+   * @param {string} period - 조회 기간 (today, week, month, year)
+>>>>>>> 87871709f2bbcdab5df004a3954d6ba0af3cadce
    * @returns {Promise<Object>} 매출 정보
    */
-  async getSales(storeId) {
+  async getSales(period = 'today') {
     try {
+<<<<<<< HEAD
       // storeId가 없으면 먼저 매장 정보를 조회해서 storeId를 가져옴
       if (!storeId) {
         const storeResponse = await this.getStore()
@@ -85,6 +226,18 @@ class StoreService {
       const response = await salesApi.get(`/${storeId}`)
 
       return formatSuccessResponse(response.data.data, '매출 정보를 조회했습니다.')
+=======
+      // 현재는 목업 데이터 반환 (추후 실제 API 연동 시 수정)
+      const mockSalesData = {
+        todaySales: 150000,
+        yesterdaySales: 120000,
+        changeRate: 25.0,
+        monthlyTarget: 3000000,
+        achievementRate: 45.2
+      }
+      
+      return formatSuccessResponse(mockSalesData, '매출 정보를 조회했습니다.')
+>>>>>>> 87871709f2bbcdab5df004a3954d6ba0af3cadce
     } catch (error) {
       console.error('매출 정보 조회 실패:', error)
       return handleApiError(error)
@@ -92,6 +245,7 @@ class StoreService {
   }
 
   /**
+<<<<<<< HEAD
    * 메뉴 등록 (STR-030: 메뉴 등록) 
    * ⚠️ 수정: 올바른 API 경로 사용
    * @param {Object} menuData - 메뉴 정보
@@ -117,10 +271,14 @@ class StoreService {
   /**
    * 메뉴 목록 조회 (STR-025: 메뉴 조회)
    * @param {number} storeId - 매장 ID
+=======
+   * 메뉴 목록 조회 (개발 예정)
+>>>>>>> 87871709f2bbcdab5df004a3954d6ba0af3cadce
    * @returns {Promise<Object>} 메뉴 목록
    */
-  async getMenus(storeId) {
+  async getMenus() {
     try {
+<<<<<<< HEAD
       const response = await storeApi.get(`/menu?storeId=${storeId}`)
 
       return formatSuccessResponse(response.data.data, '메뉴 목록을 조회했습니다.')
@@ -169,11 +327,42 @@ class StoreService {
       const response = await storeApi.get('/statistics')
 
       return formatSuccessResponse(response.data.data, '매장 통계를 조회했습니다.')
+=======
+      // 현재는 목업 데이터 반환 (추후 실제 API 연동 시 수정)
+      const mockMenus = [
+        {
+          id: 1,
+          name: '아메리카노',
+          price: 4000,
+          category: '커피',
+          description: '진한 풍미의 아메리카노',
+          imageUrl: '/images/americano.jpg',
+          isAvailable: true
+        },
+        {
+          id: 2,
+          name: '카페라떼',
+          price: 4500,
+          category: '커피',
+          description: '부드러운 우유가 들어간 라떼',
+          imageUrl: '/images/latte.jpg',
+          isAvailable: true
+        }
+      ]
+      
+      return formatSuccessResponse(mockMenus, '메뉴 목록을 조회했습니다.')
+>>>>>>> 87871709f2bbcdab5df004a3954d6ba0af3cadce
     } catch (error) {
       return handleApiError(error)
     }
   }
 }
 
+// 싱글톤 인스턴스 생성 및 export
 export const storeService = new StoreService()
-export default storeService
\ No newline at end of file
+export default storeService
+
+// 디버깅을 위한 전역 노출 (개발 환경에서만)
+if (process.env.NODE_ENV === 'development') {
+  window.storeService = storeService
+}
\ No newline at end of file
diff --git a/src/store/index.js b/src/store/index.js
index ae9412c..da8b7ff 100644
--- a/src/store/index.js
+++ b/src/store/index.js
@@ -1,285 +1,207 @@
-//* src/store/index.js
-/**
- * Pinia 스토어 설정
- * 전역 상태 관리
- */
+//* src/store/index.js - Store 스토어 수정 (fetchMenus 메서드 추가)
 import { defineStore } from 'pinia'
-import authService from '@/services/auth'
-import storeService from '@/services/store'
 
-// 인증 스토어
-export const useAuthStore = defineStore('auth', {
-  state: () => ({
-    user: null,
-    token: localStorage.getItem('token'),
-    refreshToken: localStorage.getItem('refreshToken'),
-    isAuthenticated: false
-  }),
-  
-  getters: {
-    getUserInfo: (state) => state.user,
-    isLoggedIn: (state) => state.isAuthenticated && !!state.token
-  },
-  
-  actions: {
-    async login(credentials) {
-      try {
-        const response = await authService.login(credentials)
-        this.setAuth(response.data)
-        return response
-      } catch (error) {
-        this.clearAuth()
-        throw error
-      }
-    },
-    
-    async register(userData) {
-      try {
-        const response = await authService.register(userData)
-        return response
-      } catch (error) {
-        throw error
-      }
-    },
-    
-    async logout() {
-      try {
-        if (this.token) {
-          await authService.logout()
-        }
-      } catch (error) {
-        console.error('로그아웃 오류:', error)
-      } finally {
-        this.clearAuth()
-      }
-    },
-    
-    async refreshUserInfo() {
-      try {
-        const response = await authService.getUserInfo()
-        this.user = response.data
-        this.isAuthenticated = true
-        return response
-      } catch (error) {
-        this.clearAuth()
-        throw error
-      }
-    },
-    
-    setAuth(authData) {
-      this.user = authData.user
-      this.token = authData.accessToken
-      this.refreshToken = authData.refreshToken
-      this.isAuthenticated = true
-      
-      localStorage.setItem('token', authData.accessToken)
-      localStorage.setItem('refreshToken', authData.refreshToken)
-    },
-    
-    clearAuth() {
-      this.user = null
-      this.token = null
-      this.refreshToken = null
-      this.isAuthenticated = false
-      
-      localStorage.removeItem('token')
-      localStorage.removeItem('refreshToken')
-    }
-  }
-})
-
-// 앱 전역 스토어
-export const useAppStore = defineStore('app', {
-  state: () => ({
-    loading: false,
-    snackbar: {
-      show: false,
-      message: '',
-      color: 'success',
-      timeout: 3000
-    },
-    notifications: [],
-    notificationCount: 0
-  }),
-  
-  actions: {
-    setLoading(status) {
-      this.loading = status
-    },
-    
-    showSnackbar(message, color = 'success', timeout = 3000) {
-      this.snackbar = {
-        show: true,
-        message,
-        color,
-        timeout
-      }
-    },
-    
-    hideSnackbar() {
-      this.snackbar.show = false
-    },
-    
-    addNotification(notification) {
-      this.notifications.unshift({
-        id: Date.now(),
-        timestamp: new Date(),
-        ...notification
-      })
-      this.notificationCount = this.notifications.length
-    },
-    
-    clearNotifications() {
-      this.notifications = []
-      this.notificationCount = 0
-    }
-  }
-})
-
-// 매장 스토어
 export const useStoreStore = defineStore('store', {
   state: () => ({
     storeInfo: null,
-    loading: false
-  }),
-  
-  getters: {
-    hasStoreInfo: (state) => !!state.storeInfo
-  },
-  
-  actions: {
-    setStoreInfo(storeInfo) {
-      this.storeInfo = storeInfo
-    },
-
-    async fetchStoreInfo() {
-      try {
-        this.loading = true
-        const response = await storeService.getStore() // getStoreInfo가 아닌 getStore
-        this.storeInfo = response.data
-        return response
-      } catch (error) {
-        throw error
-      } finally {
-        this.loading = false
-      }
-    },
-    
-    async registerStore(storeData) {
-      try {
-        this.loading = true
-        const response = await storeService.registerStore(storeData)
-        this.storeInfo = response.data
-        return response
-      } catch (error) {
-        throw error
-      } finally {
-        this.loading = false
-      }
-    },
-    
-    async updateStore(storeId, storeData) {
-      try {
-        this.loading = true
-        const response = await storeService.updateStore(storeId, storeData)
-        this.storeInfo = response.data
-        return response
-      } catch (error) {
-        throw error
-      } finally {
-        this.loading = false
-      }
-    },
-    
-    async createStoreInfo(storeData) {
-      try {
-        this.loading = true
-        const response = await storeService.createStoreInfo(storeData)
-        this.storeInfo = response.data
-        return response
-      } catch (error) {
-        throw error
-      } finally {
-        this.loading = false
-      }
-    }
-  }
-})
-
-// 메뉴 스토어
-export const useMenuStore = defineStore('menu', {
-  state: () => ({
-    menus: [],
+    menus: [], // 메뉴 목록 추가
     loading: false,
-    totalCount: 0
+    error: null
   }),
   
   getters: {
-    getMenuById: (state) => (id) => {
-      return state.menus.find(menu => menu.id === id)
-    },
-    
-    getMenusByCategory: (state) => (category) => {
-      return state.menus.filter(menu => menu.category === category)
-    }
+    hasStoreInfo: (state) => !!state.storeInfo,
+    isLoading: (state) => state.loading,
+    hasMenus: (state) => state.menus && state.menus.length > 0
   },
   
   actions: {
-    async fetchMenus() {
+    /**
+     * 매장 정보 조회
+     */
+    async fetchStoreInfo() {
+      console.log('=== Store 스토어: 매장 정보 조회 시작 ===')
+      this.loading = true
+      this.error = null
+      
       try {
-        this.loading = true
-        const response = await storeService.getMenus()
-        this.menus = response.data
-        this.totalCount = response.data.length
-        return response
-      } catch (error) {
-        throw error
-      } finally {
-        this.loading = false
-      }
-    },
-    
-    async createMenu(menuData) {
-      try {
-        this.loading = true
-        const response = await storeService.createMenu(menuData)
-        this.menus.push(response.data)
-        this.totalCount++
-        return response
-      } catch (error) {
-        throw error
-      } finally {
-        this.loading = false
-      }
-    },
-    
-    async updateMenu(menuId, menuData) {
-      try {
-        this.loading = true
-        const response = await storeService.updateMenu(menuId, menuData)
-        const index = this.menus.findIndex(menu => menu.id === menuId)
-        if (index !== -1) {
-          this.menus[index] = response.data
+        // 스토어 서비스 임포트
+        const { storeService } = await import('@/services/store')
+        
+        console.log('매장 정보 API 호출')
+        const result = await storeService.getStore()
+        
+        console.log('=== Store 스토어: API 응답 분석 ===')
+        console.log('Result:', result)
+        console.log('Result.success:', result.success)
+        console.log('Result.data:', result.data)
+        console.log('Result.message:', result.message)
+        
+        if (result.success && result.data) {
+          // 매장 정보가 있는 경우
+          console.log('✅ 매장 정보 설정:', result.data)
+          this.storeInfo = result.data
+          return { success: true, data: result.data }
+        } else {
+          // 매장이 없거나 조회 실패한 경우
+          console.log('⚠️ 매장 정보 없음 또는 조회 실패')
+          this.storeInfo = null
+          
+          if (result.message === '등록된 매장이 없습니다') {
+            return { success: false, message: '등록된 매장이 없습니다' }
+          } else {
+            return { success: false, message: result.message || '매장 정보 조회에 실패했습니다' }
+          }
         }
-        return response
       } catch (error) {
-        throw error
+        console.error('=== Store 스토어: 매장 정보 조회 실패 ===')
+        console.error('Error:', error)
+        
+        this.error = error.message
+        this.storeInfo = null
+        
+        // HTTP 상태 코드별 처리
+        if (error.response?.status === 404) {
+          return { success: false, message: '등록된 매장이 없습니다' }
+        }
+        
+        if (error.response?.status >= 500) {
+          return { success: false, message: '서버 오류가 발생했습니다. 잠시 후 다시 시도해주세요.' }
+        }
+        
+        if (error.response?.status === 401) {
+          return { success: false, message: '로그인이 필요합니다' }
+        }
+        
+        return { success: false, message: error.message || '매장 정보 조회에 실패했습니다' }
       } finally {
         this.loading = false
       }
     },
-    
-    async deleteMenu(menuId) {
+
+    /**
+     * 메뉴 목록 조회 - 실제 API 연동 (매장 ID 필요)
+     */
+    async fetchMenus() {
+      console.log('=== Store 스토어: 메뉴 목록 조회 시작 ===')
+      
       try {
-        this.loading = true
-        await storeService.deleteMenu(menuId)
-        this.menus = this.menus.filter(menu => menu.id !== menuId)
-        this.totalCount--
+        // 매장 정보에서 storeId 가져오기
+        const storeId = this.storeInfo?.storeId
+        if (!storeId) {
+          console.warn('매장 ID가 없습니다. 매장 정보를 먼저 조회해주세요.')
+          return { success: false, message: '매장 정보가 필요합니다', data: [] }
+        }
+        
+        // 메뉴 서비스 임포트
+        const { menuService } = await import('@/services/menu')
+        
+        console.log('메뉴 목록 API 호출, 매장 ID:', storeId)
+        const result = await menuService.getMenus(storeId)
+        
+        console.log('=== Store 스토어: 메뉴 API 응답 분석 ===')
+        console.log('Result:', result)
+        console.log('Result.success:', result.success)
+        console.log('Result.data:', result.data)
+        console.log('Result.message:', result.message)
+        
+        if (result.success && result.data) {
+          // 메뉴 목록이 있는 경우
+          console.log('✅ 메뉴 목록 설정:', result.data)
+          this.menus = result.data
+          return { success: true, data: result.data }
+        } else {
+          // 메뉴가 없거나 조회 실패한 경우
+          console.log('⚠️ 메뉴 목록 없음 또는 조회 실패')
+          this.menus = []
+          
+          if (result.message === '등록된 메뉴가 없습니다') {
+            return { success: false, message: '등록된 메뉴가 없습니다', data: [] }
+          } else {
+            return { success: false, message: result.message || '메뉴 목록 조회에 실패했습니다', data: [] }
+          }
+        }
       } catch (error) {
-        throw error
+        console.error('=== Store 스토어: 메뉴 목록 조회 실패 ===')
+        console.error('Error:', error)
+        
+        this.menus = []
+        return { success: false, message: error.message || '메뉴 목록을 불러오는데 실패했습니다', data: [] }
+      }
+    },
+
+    /**
+     * 매장 등록
+     */
+    async registerStore(storeData) {
+      console.log('매장 등록 시작:', storeData)
+      this.loading = true
+      this.error = null
+      
+      try {
+        const { storeService } = await import('@/services/store')
+        
+        const result = await storeService.registerStore(storeData)
+        
+        console.log('매장 등록 결과:', result)
+        
+        if (result.success) {
+          // 등록 성공 후 매장 정보 다시 조회
+          await this.fetchStoreInfo()
+          return result
+        } else {
+          this.error = result.message
+          return result
+        }
+      } catch (error) {
+        console.error('매장 등록 실패:', error)
+        this.error = error.message
+        return { success: false, message: error.message || '매장 등록에 실패했습니다' }
       } finally {
         this.loading = false
       }
+    },
+
+    /**
+     * 매장 정보 수정
+     */
+    async updateStore(storeId, storeData) {
+      console.log('매장 정보 수정 시작:', { storeId, storeData })
+      this.loading = true
+      this.error = null
+      
+      try {
+        const { storeService } = await import('@/services/store')
+        
+        const result = await storeService.updateStore(storeId, storeData)
+        
+        console.log('매장 수정 결과:', result)
+        
+        if (result.success) {
+          // 수정 성공 후 매장 정보 다시 조회
+          await this.fetchStoreInfo()
+          return result
+        } else {
+          this.error = result.message
+          return result
+        }
+      } catch (error) {
+        console.error('매장 수정 실패:', error)
+        this.error = error.message
+        return { success: false, message: error.message || '매장 수정에 실패했습니다' }
+      } finally {
+        this.loading = false
+      }
+    },
+
+    /**
+     * 매장 정보 초기화
+     */
+    clearStoreInfo() {
+      this.storeInfo = null
+      this.menus = []
+      this.error = null
+      this.loading = false
     }
   }
 })
\ No newline at end of file
diff --git a/src/store/store.js b/src/store/store.js
index 11b5b8a..9b35889 100644
--- a/src/store/store.js
+++ b/src/store/store.js
@@ -1,3 +1,4 @@
+<<<<<<< HEAD
 //* src/services/store.js
 import { api } from './api'
 import { formatSuccessResponse, formatErrorResponse, handleApiError } from '@/utils/api-helpers'
@@ -56,10 +57,159 @@ class StoreService {
     } catch (error) {
       console.error('매장 정보 수정 실패:', error)
       return handleApiError(error)
+=======
+// src/store/store.js - StoreService 클래스의 getMenus 메서드 올바른 문법으로 수정
+
+/**
+ * 메뉴 목록 조회 (수정된 버전 - storeId 파라미터 추가)
+ * @param {number} storeId - 매장 ID (옵션, 없으면 목업 데이터 반환)
+ * @returns {Promise<Object>} 메뉴 목록
+ */
+async getMenus(storeId) {
+  try {
+    console.log('=== 메뉴 목록 조회 API 호출 ===')
+    console.log('매장 ID:', storeId)
+    
+    // storeId가 없으면 목업 데이터 반환 (개발 중)
+    if (!storeId) {
+      console.warn('매장 ID가 없어서 목업 데이터 반환')
+      const mockMenus = [
+        {
+          menuId: 1, // id 대신 menuId 사용
+          id: 1, // 호환성을 위해
+          name: '아메리카노',
+          menuName: '아메리카노', // 백엔드 형식
+          price: 4000,
+          category: '커피',
+          description: '진한 풍미의 아메리카노',
+          imageUrl: '/images/americano.jpg',
+          isAvailable: true,
+          available: true // 백엔드 형식
+        },
+        {
+          menuId: 2,
+          id: 2,
+          name: '카페라떼',
+          menuName: '카페라떼',
+          price: 4500,
+          category: '커피',
+          description: '부드러운 우유가 들어간 라떼',
+          imageUrl: '/images/latte.jpg',
+          isAvailable: true,
+          available: true
+        }
+      ]
+      
+      return formatSuccessResponse(mockMenus, '목업 메뉴 목록을 조회했습니다.')
     }
+    
+    // 실제 백엔드 API 호출
+    try {
+      // 메뉴 API import
+      const { menuApi } = await import('./api.js')
+      
+      // GET /api/menu?storeId={storeId}
+      const response = await menuApi.get('', {
+        params: { storeId }
+      })
+      
+      console.log('메뉴 목록 조회 API 응답:', response.data)
+      
+      if (response.data && response.data.status === 200) {
+        // 백엔드에서 받은 메뉴 데이터를 프론트엔드 형식으로 변환
+        const menus = response.data.data.map(menu => ({
+          menuId: menu.menuId,
+          id: menu.menuId, // 호환성을 위해
+          storeId: menu.storeId,
+          menuName: menu.menuName,
+          name: menu.menuName, // 호환성을 위해
+          category: menu.category,
+          price: menu.price,
+          description: menu.description,
+          available: menu.available !== undefined ? menu.available : true,
+          isAvailable: menu.available !== undefined ? menu.available : true, // 호환성
+          imageUrl: menu.imageUrl || '/images/menu-placeholder.png',
+          createdAt: menu.createdAt,
+          updatedAt: menu.updatedAt
+        }))
+        
+        return formatSuccessResponse(menus, '메뉴 목록을 조회했습니다.')
+      } else {
+        throw new Error(response.data.message || '메뉴 목록을 찾을 수 없습니다.')
+      }
+    } catch (apiError) {
+      console.error('백엔드 API 호출 실패:', apiError)
+      
+      // 백엔드 미구현이나 네트워크 오류 시 목업 데이터 반환
+      if (apiError.response?.status === 404 || 
+          apiError.code === 'ECONNREFUSED' || 
+          apiError.message.includes('Network Error')) {
+        console.warn('백엔드 미구현 - 목업 데이터 반환')
+        
+        const mockMenus = [
+          {
+            menuId: 1,
+            id: 1,
+            storeId: storeId,
+            name: '아메리카노',
+            menuName: '아메리카노',
+            price: 4000,
+            category: '커피',
+            description: '진한 풍미의 아메리카노',
+            imageUrl: '/images/americano.jpg',
+            isAvailable: true,
+            available: true
+          },
+          {
+            menuId: 2,
+            id: 2,
+            storeId: storeId,
+            name: '카페라떼',
+            menuName: '카페라떼',
+            price: 4500,
+            category: '커피',
+            description: '부드러운 우유가 들어간 라떼',
+            imageUrl: '/images/latte.jpg',
+            isAvailable: true,
+            available: true
+          }
+        ]
+        
+        return formatSuccessResponse(mockMenus, '목업 메뉴 목록을 조회했습니다. (백엔드 미구현)')
+      }
+      
+      throw apiError
+>>>>>>> 87871709f2bbcdab5df004a3954d6ba0af3cadce
+    }
+  } catch (error) {
+    console.error('메뉴 목록 조회 실패:', error)
+    return handleApiError(error)
+  }
+}
+
+// 만약 fetchMenus 메서드가 따로 필요하다면 다음과 같이 추가:
+/**
+ * 메뉴 목록 조회 (fetchMenus 별칭)
+ * @param {number} storeId - 매장 ID
+ * @returns {Promise<Object>} 메뉴 목록
+ */
+async fetchMenus(storeId) {
+  return await this.getMenus(storeId)
+}
+
+// StoreService 클래스 전체 구조 예시:
+class StoreService {
+  // ... 기존 메서드들 (registerStore, getStore, updateStore 등) ...
+
+  /**
+   * 메뉴 목록 조회 (위의 getMenus 메서드)
+   */
+  async getMenus(storeId) {
+    // 위의 구현 내용
   }
 
   /**
+<<<<<<< HEAD
    * 매출 정보 조회 (STR-020: 대시보드)
    * @param {number} storeId - 매장 ID (기본값: 1)
    * @returns {Promise<Object>} 매출 정보
@@ -274,4 +424,20 @@ export default storeService
 // 디버깅을 위한 전역 노출 (개발 환경에서만)
 if (process.env.NODE_ENV === 'development') {
   window.storeService = storeService
-}
\ No newline at end of file
+}
+=======
+   * 메뉴 목록 조회 별칭
+   */
+  async fetchMenus(storeId) {
+    return await this.getMenus(storeId)
+  }
+}
+
+// 올바른 JavaScript 클래스 메서드 문법:
+// ❌ 잘못된 문법:
+// async function getMenus(storeId) { ... }
+// function async getMenus(storeId) { ... }
+
+// ✅ 올바른 문법:
+// async getMenus(storeId) { ... }
+>>>>>>> 87871709f2bbcdab5df004a3954d6ba0af3cadce
diff --git a/src/views/StoreManagementView.vue b/src/views/StoreManagementView.vue
index 7494f3f..ee2ca70 100644
--- a/src/views/StoreManagementView.vue
+++ b/src/views/StoreManagementView.vue
@@ -1,4 +1,5 @@
-//* src/views/StoreManagementView.vue
+//* src/views/StoreManagementView.vue - 완전한 매장 등록 화면
+
 <template>
   <v-container fluid class="pa-4">
     <!-- 매장 정보가 없는 경우 -->
@@ -20,19 +21,10 @@
                 color="primary"
                 size="large"
                 prepend-icon="mdi-store-plus"
-                @click="showCreateDialog = true"
+                @click="openCreateDialog"
               >
                 매장 정보 등록하기
               </v-btn>
-              <v-btn
-                color="success"
-                size="large"
-                variant="outlined"
-                prepend-icon="mdi-eye"
-                @click="loadDemoStoreData"
-              >
-                데모 매장 정보로 미리보기
-              </v-btn>
             </div>
           </v-card>
         </v-col>
@@ -52,7 +44,7 @@
       </v-row>
 
       <v-tabs-window v-model="currentTab">
-        <!-- 기본 정보 탭 (운영 설정 포함) -->
+        <!-- 기본 정보 탭 -->
         <v-tabs-window-item value="basic">
           <v-card elevation="2">
             <v-card-title class="pa-4 d-flex align-center justify-space-between">
@@ -74,134 +66,97 @@
             
             <v-card-text class="pa-6">
               <v-row>
-                <v-col cols="12" md="4">
-                  <div class="text-center">
-                    <v-avatar size="120" class="mb-4">
-                      <v-img
-                        :src="storeInfo.imageUrl || '/images/store-placeholder.png'"
-                        :alt="storeInfo.storeName"
-                      />
-                    </v-avatar>
-                    <h3 class="text-h6 font-weight-bold">{{ storeInfo.storeName }}</h3>
-                    <p class="text-caption text-grey">{{ storeInfo.businessType }}</p>
-                  </div>
+                <!-- 매장 이미지 -->
+                <v-col cols="12" md="4" class="text-center">
+                  <v-avatar size="120" class="mb-3">
+                    <v-img
+                      :src="storeInfo.imageUrl || '/images/store-placeholder.png'"
+                      alt="매장 이미지"
+                    />
+                  </v-avatar>
+                  <h3 class="text-h6 font-weight-bold">{{ storeInfo.storeName }}</h3>
+                  <p class="text-grey">{{ storeInfo.businessType }}</p>
                 </v-col>
-                
+
+                <!-- 기본 정보 -->
                 <v-col cols="12" md="8">
                   <v-row>
                     <v-col cols="12" sm="6">
-                      <div class="mb-4">
-                        <h4 class="text-subtitle-2 text-grey mb-1">사업자명</h4>
-                        <p class="text-body-1">{{ storeInfo.ownerName }}</p>
+                      <div class="info-item">
+                        <v-icon class="mr-2" color="grey">mdi-map-marker</v-icon>
+                        <div>
+                          <div class="text-caption text-grey">주소</div>
+                          <div class="text-body-1">{{ storeInfo.address || '미입력' }}</div>
+                        </div>
                       </div>
                     </v-col>
                     
                     <v-col cols="12" sm="6">
-                      <div class="mb-4">
-                        <h4 class="text-subtitle-2 text-grey mb-1">사업자등록번호</h4>
-                        <p class="text-body-1">{{ storeInfo.businessNumber }}</p>
-                      </div>
-                    </v-col>
-                    
-                    <v-col cols="12">
-                      <div class="mb-4">
-                        <h4 class="text-subtitle-2 text-grey mb-1">주소</h4>
-                        <p class="text-body-1">{{ storeInfo.address }}</p>
+                      <div class="info-item">
+                        <v-icon class="mr-2" color="grey">mdi-phone</v-icon>
+                        <div>
+                          <div class="text-caption text-grey">전화번호</div>
+                          <div class="text-body-1">{{ storeInfo.phoneNumber || '미입력' }}</div>
+                        </div>
                       </div>
                     </v-col>
                     
                     <v-col cols="12" sm="6">
-                      <div class="mb-4">
-                        <h4 class="text-subtitle-2 text-grey mb-1">연락처</h4>
-                        <p class="text-body-1">{{ storeInfo.phoneNumber }}</p>
+                      <div class="info-item">
+                        <v-icon class="mr-2" color="grey">mdi-clock</v-icon>
+                        <div>
+                          <div class="text-caption text-grey">영업시간</div>
+                          <div class="text-body-1">{{ storeInfo.businessHours || '미입력' }}</div>
+                        </div>
                       </div>
                     </v-col>
-                    
+                
                     <v-col cols="12" sm="6">
-                      <div class="mb-4">
-                        <h4 class="text-subtitle-2 text-grey mb-1">좌석 수</h4>
-                        <p class="text-body-1">{{ storeInfo.seatCount }}석</p>
+                      <div class="info-item">
+                        <v-icon class="mr-2" color="grey">mdi-calendar-remove</v-icon>
+                        <div>
+                          <div class="text-caption text-grey">휴무일</div>
+                          <div class="text-body-1">
+                            {{ formatClosedDays(storeInfo.closedDays) }}
+                          </div>
+                        </div>
                       </div>
                     </v-col>
                   </v-row>
-                </v-col>
-              </v-row>
-              
-              <!-- SNS 계정 정보 -->
-              <v-divider class="my-6" />
-              
-              <h4 class="text-h6 font-weight-bold mb-4">SNS 계정 정보</h4>
-              
-              <v-row>
-                <v-col cols="12" sm="6">
-                  <div class="d-flex align-center justify-space-between">
-                    <div class="d-flex align-center">
-                      <v-icon color="purple" class="mr-3">mdi-instagram</v-icon>
-                      <div>
-                        <p class="text-body-2 text-grey mb-1">Instagram</p>
-                        <p class="text-body-1">{{ storeInfo.instagramUrl || '등록되지 않음' }}</p>
-                      </div>
-                    </div>
+
+                  <!-- SNS 정보 -->
+                  <v-divider class="my-6" />
                   
-                  </div>
-                </v-col>
-                
-                <v-col cols="12" sm="6">
-                  <div class="d-flex align-center justify-space-between">
-                    <div class="d-flex align-center">
-                      <v-icon color="green" class="mr-3">mdi-blogger</v-icon>
-                      <div>
-                        <p class="text-body-2 text-grey mb-1">네이버 블로그</p>
-                        <p class="text-body-1">{{ storeInfo.blogUrl || '등록되지 않음' }}</p>
-                      </div>
-                    </div>
+                  <h4 class="text-h6 font-weight-bold mb-4">
+                    <v-icon class="mr-2" color="primary">mdi-share-variant</v-icon>
+                    SNS 정보
+                  </h4>
                   
-                  </div>
-                </v-col>
-              </v-row>
-              
-              <!-- 운영 정보 -->
-              <v-divider class="my-6" />
-              
-              <h4 class="text-h6 font-weight-bold mb-4">운영 정보</h4>
-              
-              <v-row>
-                <v-col cols="12" sm="4">
-                  <div class="mb-4">
-                    <h4 class="text-subtitle-2 text-grey mb-1">영업시간</h4>
-                    <p class="text-body-1">{{ storeInfo.openTime }} - {{ storeInfo.closeTime }}</p>
-                  </div>
-                </v-col>
-                
-                <v-col cols="12" sm="4">
-                  <div class="mb-4">
-                    <h4 class="text-subtitle-2 text-grey mb-1">휴무일</h4>
-                    <p class="text-body-1">{{ formatHolidays(storeInfo.holidays) }}</p>
-                  </div>
-                </v-col>
-                
-                <v-col cols="12" sm="4">
-                  <div class="mb-4">
-                    <h4 class="text-subtitle-2 text-grey mb-1">서비스</h4>
-                    <div class="d-flex gap-2">
-                      <v-chip
-                        v-if="storeInfo.deliveryAvailable"
-                        color="success"
-                        size="small"
-                        variant="tonal"
-                      >
-                        배달
-                      </v-chip>
-                      <v-chip
-                        v-if="storeInfo.takeoutAvailable"
-                        color="primary"
-                        size="small"
-                        variant="tonal"
-                      >
-                        포장
-                      </v-chip>
-                    </div>
-                  </div>
+                  <v-row>
+                    <v-col cols="12" sm="6">
+                      <div class="info-item">
+                        <v-icon class="mr-2" color="pink">mdi-instagram</v-icon>
+                        <div>
+                          <div class="text-caption text-grey">인스타그램</div>
+                          <div class="text-body-1">
+                            {{ storeInfo.instaAccounts || '미연동' }}
+                          </div>
+                        </div>
+                      </div>
+                    </v-col>
+                    
+                    <v-col cols="12" sm="6">
+                      <div class="info-item">
+                        <v-icon class="mr-2" color="green">mdi-post</v-icon>
+                        <div>
+                          <div class="text-caption text-grey">네이버 블로그</div>
+                          <div class="text-body-1">
+                            {{ storeInfo.blogAccounts || '미연동' }}
+                          </div>
+                        </div>
+                      </div>
+                    </v-col>
+                  </v-row>
                 </v-col>
               </v-row>
             </v-card-text>
@@ -403,215 +358,91 @@
       <p class="text-body-1">매장 정보를 불러오는 중...</p>
     </div>
 
-    <!-- 스낵바 -->
-    <v-snackbar
-      v-model="snackbar.show"
-      :color="snackbar.color"
-      :timeout="3000"
-      location="bottom"
-    >
-      {{ snackbar.message }}
-    </v-snackbar>
-    
     <!-- 매장 등록/수정 다이얼로그 -->
     <v-dialog
       v-model="showCreateDialog"
-      max-width="800"
+      max-width="600"
       persistent
-      scrollable
     >
       <v-card>
         <v-card-title class="pa-4">
-          <span class="text-h6">{{ editMode ? '매장 정보 수정' : '매장 정보 등록' }}</span>
-          <v-spacer />
+          <div class="d-flex align-center">
+            <v-icon class="mr-2" color="primary">mdi-store-plus</v-icon>
+            {{ editMode ? '매장 정보 수정' : '매장 정보 등록' }}
+          </div>
         </v-card-title>
-
+        
         <v-divider />
-
-        <v-card-text class="pa-6" style="max-height: 500px;">
-          <v-form ref="storeForm" v-model="formValid">
+        
+        <v-card-text class="pa-4">
+          <v-form ref="storeFormRef" v-model="formValid">
             <v-row>
-              <!-- 매장 이미지 -->
+              <!-- 매장명 -->
               <v-col cols="12">
-                <h4 class="text-subtitle-1 font-weight-bold mb-3">매장 이미지</h4>
-                <div class="text-center mb-4">
-                  <v-avatar size="120" class="mb-3">
-                    <v-img
-                      :src="formData.imageUrl || '/images/store-placeholder.png'"
-                      alt="매장 이미지"
-                    />
-                  </v-avatar>
-                  <br>
-                  <v-btn
-                    color="primary"
-                    variant="outlined"
-                    prepend-icon="mdi-camera"
-                    @click="selectImage"
-                  >
-                    이미지 선택
-                  </v-btn>
-                  <input
-                    ref="imageInput"
-                    type="file"
-                    accept="image/*"
-                    style="display: none;"
-                    @change="handleImageUpload"
-                  >
-                </div>
-              </v-col>
-
-              <!-- 기본 정보 -->
-              <v-col cols="12" sm="6">
                 <v-text-field
                   v-model="formData.storeName"
                   label="매장명 *"
-                  variant="outlined"
                   :rules="[v => !!v || '매장명을 입력해주세요']"
-                  required
+                  prepend-inner-icon="mdi-store"
+                  variant="outlined"
                 />
               </v-col>
 
+              <!-- 업종 -->
               <v-col cols="12" sm="6">
                 <v-select
                   v-model="formData.businessType"
                   label="업종 *"
-                  variant="outlined"
                   :items="businessTypes"
                   :rules="[v => !!v || '업종을 선택해주세요']"
-                  required
+                  prepend-inner-icon="mdi-domain"
+                  variant="outlined"
                 />
               </v-col>
 
+              <!-- 좌석수 -->
               <v-col cols="12" sm="6">
                 <v-text-field
-                  v-model="formData.ownerName"
-                  label="사업자명 *"
+                  v-model.number="formData.seatCount"
+                  label="좌석수"
+                  type="number"
+                  prepend-inner-icon="mdi-chair-school"
                   variant="outlined"
-                  :rules="[v => !!v || '사업자명을 입력해주세요']"
-                  required
-                />
-              </v-col>
-
-              <v-col cols="12" sm="6">
-                <v-text-field
-                  v-model="formData.businessNumber"
-                  label="사업자등록번호 *"
-                  variant="outlined"
-                  :rules="businessNumberRules"
-                  required
+                  :min="0"
+                  :max="500"
                 />
               </v-col>
 
+              <!-- 주소 -->
               <v-col cols="12">
                 <v-text-field
                   v-model="formData.address"
                   label="주소 *"
-                  variant="outlined"
                   :rules="[v => !!v || '주소를 입력해주세요']"
-                  required
+                  prepend-inner-icon="mdi-map-marker"
+                  variant="outlined"
                 />
               </v-col>
 
-              <v-col cols="12" sm="6">
+              <!-- 전화번호 -->
+              <v-col cols="12">
                 <v-text-field
                   v-model="formData.phoneNumber"
-                  label="연락처 *"
+                  label="전화번호"
+                  prepend-inner-icon="mdi-phone"
                   variant="outlined"
-                  :rules="phoneRules"
-                  required
+                  placeholder="예) 02-1234-5678"
                 />
               </v-col>
 
-              <v-col cols="12" sm="6">
-                <v-text-field
-                  v-model.number="formData.seatCount"
-                  label="좌석 수"
-                  variant="outlined"
-                  type="number"
-                  min="0"
-                />
-              </v-col>
-
-            </v-row>
-
-            <!-- SNS 정보 섹션 -->
-            <v-divider class="my-4" />
-            <h3 class="text-h6 font-weight-bold mb-6">SNS 계정 정보</h3>
-            
-            <!-- 인스타그램 -->
-            <div class="mb-6">
-              <div class="d-flex align-center mb-3">
-                <v-icon color="purple" class="mr-2">mdi-instagram</v-icon>
-                <span class="text-subtitle-2 font-weight-medium">인스타그램</span>
-              </div>
-              
-              <div class="sns-input-container">
-                <div class="sns-input-row">
-                  <v-text-field
-                    v-model="formData.instagramUrl"
-                    placeholder="@계정명 또는 URL 입력"
-                    variant="outlined"
-                    density="comfortable"
-                    prepend-inner-icon="mdi-at"
-                    hide-details="auto"
-                    class="sns-text-field"
-                  />
-                  <v-btn
-                    color="purple"
-                    variant="tonal"
-                    :loading="snsCheckLoading.instagram"
-                    @click="checkSnsConnection('instagram')"
-                    class="sns-check-btn ml-4"
-                  >
-                    연동 확인
-                  </v-btn>
-                </div>
-              </div>
-            </div>
-
-            <!-- 네이버 블로그 -->
-            <div class="mb-6">
-              <div class="d-flex align-center mb-3">
-                <v-icon color="green" class="mr-2">mdi-web</v-icon>
-                <span class="text-subtitle-2 font-weight-medium">네이버 블로그</span>
-              </div>
-              
-              <div class="sns-input-container">
-                <div class="sns-input-row">
-                  <v-text-field
-                    v-model="formData.blogUrl"
-                    placeholder="blog.naver.com/계정명 형식으로 입력"
-                    variant="outlined"
-                    density="comfortable"
-                    prepend-inner-icon="mdi-web"
-                    hide-details="auto"
-                    class="sns-text-field"
-                  />
-                  <v-btn
-                    color="green"
-                    variant="tonal"
-                    :loading="snsCheckLoading.blog"
-                    @click="checkSnsConnection('blog')"
-                    class="sns-check-btn ml-4"
-                  >
-                    연동 확인
-                  </v-btn>
-                </div>
-              </div>
-            </div>
-
-            <!-- 운영 정보 -->
-            <v-divider class="my-4" />
-            <h4 class="text-subtitle-1 font-weight-bold mb-3">운영 정보</h4>
-            
-            <v-row>
-
+              <!-- 영업시간 -->
               <v-col cols="12" sm="6">
                 <v-text-field
                   v-model="formData.openTime"
                   label="오픈 시간"
-                  variant="outlined"
                   type="time"
+                  prepend-inner-icon="mdi-clock-start"
+                  variant="outlined"
                 />
               </v-col>
 
@@ -619,58 +450,214 @@
                 <v-text-field
                   v-model="formData.closeTime"
                   label="마감 시간"
-                  variant="outlined"
                   type="time"
+                  prepend-inner-icon="mdi-clock-end"
+                  variant="outlined"
                 />
               </v-col>
 
+              <!-- 휴무일 -->
               <v-col cols="12">
                 <v-select
                   v-model="formData.holidays"
                   label="휴무일"
+                  :items="weekDays"
+                  prepend-inner-icon="mdi-calendar-remove"
                   variant="outlined"
-                  :items="daysOfWeek"
                   multiple
                   chips
+                  closable-chips
                 />
               </v-col>
 
-              <v-col cols="12" sm="6">
-                <v-switch
-                  v-model="formData.deliveryAvailable"
-                  label="배달 서비스"
-                  color="primary"
+              <!-- SNS 계정 -->
+              <v-col cols="12">
+                <v-text-field
+                  v-model="formData.instagramUrl"
+                  label="인스타그램 계정"
+                  prepend-inner-icon="mdi-instagram"
+                  variant="outlined"
+                  placeholder="예) @your_instagram"
                 />
               </v-col>
 
-              <v-col cols="12" sm="6">
-                <v-switch
-                  v-model="formData.takeoutAvailable"
-                  label="포장 서비스"
-                  color="primary"
+              <v-col cols="12">
+                <v-text-field
+                  v-model="formData.blogUrl"
+                  label="네이버 블로그"
+                  prepend-inner-icon="mdi-post"
+                  variant="outlined"
+                  placeholder="예) blog.naver.com/your_blog"
                 />
               </v-col>
             </v-row>
           </v-form>
         </v-card-text>
-
+        
         <v-divider />
-
+        
         <v-card-actions class="pa-4">
           <v-spacer />
           <v-btn
-            variant="text"
-            @click="closeDialog"
+            color="grey"
+            variant="outlined"
+            @click="cancelForm"
+            :disabled="saving"
           >
             취소
           </v-btn>
           <v-btn
             color="primary"
+            @click="saveStoreInfo"
             :loading="saving"
             :disabled="!formValid"
-            @click="saveStoreInfo"
           >
-            {{ editMode ? '수정하기' : '등록하기' }}
+            {{ editMode ? '수정' : '등록' }}
+          </v-btn>
+        </v-card-actions>
+      </v-card>
+    </v-dialog>
+
+    <!-- 메뉴 상세 다이얼로그 -->
+    <v-dialog
+      v-model="showMenuDetailDialog"
+      max-width="600"
+      persistent
+    >
+      <v-card v-if="selectedMenu">
+        <v-card-title class="pa-4">
+          <div class="d-flex align-center justify-space-between w-100">
+            <div class="d-flex align-center">
+              <v-icon class="mr-2" color="primary">mdi-food</v-icon>
+              메뉴 상세 정보
+            </div>
+            <div class="d-flex align-center">
+              <!-- 상태 배지 -->
+              <v-chip
+                :color="selectedMenu.available ? 'success' : 'error'"
+                size="small"
+                variant="elevated"
+                class="mr-2"
+              >
+                {{ selectedMenu.available ? '판매중' : '품절' }}
+              </v-chip>
+              
+              <!-- 추천 메뉴 배지 -->
+              <v-chip
+                v-if="selectedMenu.recommended"
+                color="warning"
+                size="small"
+                variant="elevated"
+              >
+                <v-icon size="small" class="mr-1">mdi-star</v-icon>
+                추천
+              </v-chip>
+            </div>
+          </div>
+        </v-card-title>
+        
+        <v-divider />
+        
+        <v-card-text class="pa-0">
+          <!-- 메뉴 이미지 -->
+          <v-img
+            :src="selectedMenu.imageUrl || selectedMenu.image || '/images/menu-placeholder.png'"
+            :alt="selectedMenu.menuName"
+            height="300"
+            cover
+            class="mb-4"
+          >
+            <template v-slot:placeholder>
+              <div class="d-flex align-center justify-center fill-height">
+                <v-icon size="64" color="grey-lighten-2">mdi-food</v-icon>
+              </div>
+            </template>
+          </v-img>
+          
+          <div class="pa-4">
+            <!-- 메뉴 기본 정보 -->
+            <div class="mb-4">
+              <div class="d-flex align-center justify-space-between mb-2">
+                <h2 class="text-h5 font-weight-bold">{{ selectedMenu.menuName }}</h2>
+                <span class="text-h4 font-weight-bold text-primary">
+                  {{ formatCurrency(selectedMenu.price) }}
+                </span>
+              </div>
+              
+              <v-chip
+                :color="getCategoryColor(selectedMenu.category)"
+                size="small"
+                variant="tonal"
+                class="mb-3"
+              >
+                {{ selectedMenu.category }}
+              </v-chip>
+              
+              <p class="text-body-1 text-grey-darken-1 mb-0">
+                {{ selectedMenu.description || '메뉴 설명이 없습니다.' }}
+              </p>
+            </div>
+            
+            <!-- 메뉴 상세 정보 -->
+            <v-divider class="my-4" />
+            
+            <div class="mb-4">
+              <h4 class="text-h6 font-weight-bold mb-3 d-flex align-center">
+                <v-icon class="mr-2" color="primary">mdi-information</v-icon>
+                상세 정보
+              </h4>
+              
+              <v-row>
+                <v-col cols="6">
+                  <div class="info-item">
+                    <v-icon class="mr-2" color="grey">mdi-tag</v-icon>
+                    <div>
+                      <div class="text-caption text-grey">카테고리</div>
+                      <div class="text-body-1">{{ selectedMenu.category }}</div>
+                    </div>
+                  </div>
+                </v-col>
+                
+                <v-col cols="6">
+                  <div class="info-item">
+                    <v-icon class="mr-2" color="grey">mdi-currency-krw</v-icon>
+                    <div>
+                      <div class="text-caption text-grey">가격</div>
+                      <div class="text-body-1">{{ formatCurrency(selectedMenu.price) }}</div>
+                    </div>
+                  </div>
+                </v-col>
+              </v-row>
+            </div>
+          </div>
+        </v-card-text>
+        
+        <v-divider />
+        
+        <v-card-actions class="pa-4">
+          <v-spacer />
+          <v-btn
+            color="grey"
+            variant="outlined"
+            @click="closeMenuDetail"
+          >
+            닫기
+          </v-btn>
+          <v-btn
+            color="primary"
+            variant="outlined"
+            prepend-icon="mdi-pencil"
+            @click="editMenuFromDetail"
+          >
+            수정
+          </v-btn>
+          <v-btn
+            color="error"
+            variant="outlined"
+            prepend-icon="mdi-delete"
+            @click="deleteMenuFromDetail"
+          >
+            삭제
           </v-btn>
         </v-card-actions>
       </v-card>
@@ -681,311 +668,165 @@
       v-model="showMenuDialog"
       max-width="600"
       persistent
-      scrollable
     >
       <v-card>
-        <v-card-title class="pa-4 d-flex align-center justify-space-between">
-          <span class="text-h6">{{ editMenuMode ? '메뉴 수정' : '메뉴 등록' }}</span>
-          <v-btn
-            icon
-            @click="closeMenuDialog"
-          >
-            <v-icon>mdi-close</v-icon>
-          </v-btn>
+        <v-card-title class="pa-4">
+          <div class="d-flex align-center">
+            <v-icon class="mr-2" color="primary">mdi-food-plus</v-icon>
+            {{ menuEditMode ? '메뉴 수정' : '메뉴 등록' }}
+          </div>
         </v-card-title>
-
+        
         <v-divider />
-
-        <v-card-text class="pa-6" style="max-height: 500px;">
-          <v-form ref="menuForm" v-model="menuFormValid">
-            <!-- 메뉴 이미지 -->
-            <div class="text-center mb-6">
-              <v-img
-                :src="menuFormData.imageUrl || '/images/menu-placeholder.png'"
-                :alt="menuFormData.menuName"
-                max-width="200"
-                max-height="150"
-                class="mx-auto mb-3 rounded"
-              />
-              <v-btn
-                color="primary"
-                variant="outlined"
-                prepend-icon="mdi-camera"
-                @click="selectMenuImage"
-              >
-                이미지 선택
-              </v-btn>
-              <input
-                ref="menuImageInput"
-                type="file"
-                accept="image/*"
-                style="display: none;"
-                @change="handleMenuImageUpload"
-              >
-            </div>
-
+        
+        <v-card-text class="pa-4">
+          <v-form ref="menuFormRef" v-model="formValid">
             <v-row>
-              <v-col cols="12" sm="8">
+              <!-- 메뉴명 -->
+              <v-col cols="12">
                 <v-text-field
                   v-model="menuFormData.menuName"
                   label="메뉴명 *"
-                  variant="outlined"
                   :rules="[v => !!v || '메뉴명을 입력해주세요']"
-                  required
+                  prepend-inner-icon="mdi-food"
+                  variant="outlined"
                 />
               </v-col>
 
-              <v-col cols="12" sm="4">
+              <!-- 카테고리 -->
+              <v-col cols="12" sm="6">
+                <v-select
+                  v-model="menuFormData.category"
+                  label="카테고리 *"
+                  :items="menuCategories"
+                  :rules="[v => !!v || '카테고리를 선택해주세요']"
+                  prepend-inner-icon="mdi-tag"
+                  variant="outlined"
+                />
+              </v-col>
+
+              <!-- 가격 -->
+              <v-col cols="12" sm="6">
                 <v-text-field
                   v-model.number="menuFormData.price"
                   label="가격 *"
-                  variant="outlined"
                   type="number"
-                  prefix="₩"
-                  :rules="priceRules"
-                  required
-                />
-              </v-col>
-
-              <v-col cols="12">
-                <v-combobox
-                  v-model="menuFormData.category"
-                  label="카테고리 *"
+                  :rules="[v => !!v || '가격을 입력해주세요', v => v > 0 || '가격은 0원보다 커야 합니다']"
+                  prepend-inner-icon="mdi-currency-krw"
                   variant="outlined"
-                  :items="menuCategories"
-                  :rules="[v => !!v || '카테고리를 선택해주세요']"
-                  required
+                  :min="0"
                 />
               </v-col>
 
+              <!-- 메뉴 설명 -->
               <v-col cols="12">
                 <v-textarea
                   v-model="menuFormData.description"
                   label="메뉴 설명"
+                  prepend-inner-icon="mdi-text"
                   variant="outlined"
                   rows="3"
-                  placeholder="메뉴에 대한 자세한 설명을 입력해주세요"
+                  :rules="[v => !v || v.length <= 500 || '설명은 500자 이하로 입력해주세요']"
                 />
               </v-col>
 
-              <v-col cols="12" sm="6">
-                <div class="d-flex flex-column gap-2 mt-4">
-                  <v-switch
-                    v-model="menuFormData.available"
-                    label="판매 중"
-                    color="success"
-                  />
-                  <v-switch
-                    v-model="menuFormData.recommended"
-                    label="추천 메뉴"
-                    color="warning"
-                  />
-                </div>
+              <!-- 메뉴 옵션 -->
+              <v-col cols="12">
+                <v-row>
+                  <v-col cols="6">
+                    <v-switch
+                      v-model="menuFormData.available"
+                      label="판매 중"
+                      color="success"
+                      hide-details
+                    />
+                  </v-col>
+                  <v-col cols="6">
+                    <v-switch
+                      v-model="menuFormData.recommended"
+                      label="추천 메뉴"
+                      color="warning"
+                      hide-details
+                    />
+                  </v-col>
+                </v-row>
               </v-col>
             </v-row>
           </v-form>
         </v-card-text>
-
+        
         <v-divider />
-
+        
         <v-card-actions class="pa-4">
-          <v-spacer />
-          <v-btn
-            variant="text"
-            @click="closeMenuDialog"
-          >
-            취소
-          </v-btn>
-          <v-btn
-            color="primary"
-            :loading="savingMenu"
-            :disabled="!menuFormValid"
-            @click="saveMenu"
-          >
-            {{ editMenuMode ? '수정하기' : '등록하기' }}
-          </v-btn>
-        </v-card-actions>
-      </v-card>
-    </v-dialog>
-
-    <!-- 메뉴 삭제 확인 다이얼로그 -->
-    <v-dialog v-model="showDeleteMenuDialog" max-width="400">
-      <v-card>
-        <v-card-title class="text-h6">메뉴 삭제</v-card-title>
-        <v-card-text>
-          <p>정말로 <strong>{{ deleteMenuTarget?.menuName }}</strong> 메뉴를 삭제하시겠습니까?</p>
-          <v-alert type="warning" variant="tonal" class="mt-3">
-            삭제된 메뉴는 복구할 수 없습니다.
-          </v-alert>
-        </v-card-text>
-        <v-card-actions>
           <v-spacer />
           <v-btn
             color="grey"
-            variant="text"
-            @click="showDeleteMenuDialog = false"
+            variant="outlined"
+            @click="cancelMenuForm"
+            :disabled="saving"
           >
             취소
           </v-btn>
-          <v-btn
-            color="error"
-            :loading="deletingMenu"
-            @click="deleteMenu"
-          >
-            삭제
-          </v-btn>
-        </v-card-actions>
-      </v-card>
-    </v-dialog>
-
-    <!-- 메뉴 상세 다이얼로그 -->
-    <v-dialog v-model="showMenuDetailDialog" max-width="500">
-      <v-card class="menu-detail-card">
-        <v-card-title class="pa-4 d-flex align-center justify-space-between">
-          <span class="text-h6">메뉴 상세 정보</span>
-          <v-btn
-            icon
-            @click="showMenuDetailDialog = false"
-          >
-            <v-icon>mdi-close</v-icon>
-          </v-btn>
-        </v-card-title>
-
-        <v-divider />
-
-        <v-card-text class="pa-4" v-if="selectedMenuDetail">
-          <!-- 메뉴 이미지 -->
-          <div class="text-center mb-4">
-            <v-img
-              :src="selectedMenuDetail.imageUrl || '/images/menu-placeholder.png'"
-              :alt="selectedMenuDetail.menuName"
-              max-width="300"
-              max-height="200"
-              class="mx-auto rounded"
-            />
-          </div>
-
-          <!-- 메뉴 기본 정보 -->
-          <div class="menu-detail-info mb-4">
-            <h3 class="text-h6 font-weight-bold mb-2">{{ selectedMenuDetail.menuName }}</h3>
-            <p class="text-body-1 mb-2">
-              {{ selectedMenuDetail.description || '설명이 없습니다.' }}
-            </p>
-          </div>
-
-          <!-- 메뉴 정보 카드들 -->
-          <v-row>
-            <v-col cols="6">
-              <v-card variant="tonal" color="primary" class="text-center pa-4">
-                <v-icon size="32" class="mb-2">mdi-food</v-icon>
-                <h4 class="text-subtitle-1 font-weight-bold">카테고리</h4>
-                <p class="text-body-2">{{ selectedMenuDetail.category }}</p>
-              </v-card>
-            </v-col>
-            <v-col cols="6">
-              <v-card variant="tonal" color="success" class="text-center pa-4">
-                <v-icon size="32" class="mb-2">mdi-currency-krw</v-icon>
-                <h4 class="text-subtitle-1 font-weight-bold">가격</h4>
-                <p class="text-body-2">{{ formatCurrency(selectedMenuDetail.price) }}</p>
-              </v-card>
-            </v-col>
-          </v-row>
-        </v-card-text>
-
-        <v-divider />
-
-        <v-card-actions class="pa-4 justify-end">
-          <v-btn
-            variant="text"
-            @click="showMenuDetailDialog = false"
-          >
-            닫기
-          </v-btn>
           <v-btn
             color="primary"
-            @click="editFromDetail"
+            @click="saveMenu"
+            :loading="saving"
+            :disabled="!formValid"
           >
-            수정하기
+            {{ menuEditMode ? '수정' : '등록' }}
           </v-btn>
         </v-card-actions>
       </v-card>
     </v-dialog>
 
-    <!-- SNS 연동 확인 결과 다이얼로그 -->
-    <v-dialog v-model="showSnsResultDialog" max-width="400">
-      <v-card>
-        <v-card-title class="pa-4">
-          <v-icon :color="snsConnectionResult.success ? 'success' : 'error'" class="mr-2">
-            {{ snsConnectionResult.success ? 'mdi-check-circle' : 'mdi-alert-circle' }}
-          </v-icon>
-          SNS 연동 확인
-        </v-card-title>
-        <v-card-text class="pa-4">
-          <p>{{ snsConnectionResult.message }}</p>
-        </v-card-text>
-        <v-card-actions class="pa-4">
-          <v-spacer />
-          <v-btn
-            color="primary"
-            @click="showSnsResultDialog = false"
-          >
-            확인
-          </v-btn>
-        </v-card-actions>
-      </v-card>
-    </v-dialog>
+    <!-- 스낵바 -->
+    <v-snackbar
+      v-model="snackbar.show"
+      :color="snackbar.color"
+      :timeout="3000"
+      location="bottom"
+    >
+      {{ snackbar.message }}
+    </v-snackbar>
   </v-container>
 </template>
 
 <script setup>
 import { ref, computed, onMounted } from 'vue'
-import { useStoreStore } from '@/store/index'
+import { useStoreStore } from '@/store/index'  // 올바른 경로로 수정
 
-/**
- * AI 마케팅 서비스 - 매장 관리 페이지
- * 매장 정보 관리 및 메뉴 관리 기능 제공
- * 유저스토리: STR-005, STR-010, STR-015, STR-020, STR-025, STR-030, STR-035, STR-040
- */
-
-// 스토어
 const storeStore = useStoreStore()
 
-// 탭 관리
+// 반응형 상태
 const currentTab = ref('basic')
-
-// 매장 정보 관련 상태
 const showCreateDialog = ref(false)
 const editMode = ref(false)
 const formValid = ref(false)
 const saving = ref(false)
-const imageInput = ref(null)
+const storeFormRef = ref(null) // 폼 참조
 
 // 메뉴 관리 관련 상태
-const showMenuDialog = ref(false)
-const editMenuMode = ref(false)
-const menuFormValid = ref(false)
-const savingMenu = ref(false)
-const deletingMenu = ref(false)
-const showDeleteMenuDialog = ref(false)
-const deleteMenuTarget = ref(null)
-const menuImageInput = ref(null)
+const menus = ref([])
 const menuSearch = ref('')
 const menuCategoryFilter = ref('전체')
-const menuStatusFilter = ref('전체')
-
-// SNS 연동 관련 상태
-const snsCheckLoading = ref({
-  instagram: false,
-  blog: false
-})
-const showSnsResultDialog = ref(false)
-const snsConnectionResult = ref({
-  success: false,
-  platform: '',
-  message: ''
+const menuCategories = ref(['커피', '음료', '디저트', '베이커리', '샐러드', '샌드위치'])
+const showMenuDialog = ref(false)
+const menuEditMode = ref(false)
+const menuFormRef = ref(null)
+const menuFormData = ref({
+  menuName: '',
+  category: '',
+  price: 0,
+  description: '',
+  available: true,
+  recommended: false,
+  imageUrl: ''
 })
 
-// 스낵바 상태
+// 메뉴 상세 관련 상태
+const showMenuDetailDialog = ref(false)
+const selectedMenu = ref(null)
+
 const snackbar = ref({
   show: false,
   message: '',
@@ -996,8 +837,6 @@ const snackbar = ref({
 const formData = ref({
   storeName: '',
   businessType: '',
-  ownerName: '',
-  businessNumber: '',
   address: '',
   phoneNumber: '',
   seatCount: 0,
@@ -1006,111 +845,15 @@ const formData = ref({
   openTime: '09:00',
   closeTime: '21:00',
   holidays: [],
-  deliveryAvailable: false,
-  takeoutAvailable: true,
-  imageUrl: ''
+  description: ''
 })
 
-// 메뉴 폼 데이터
-const menuFormData = ref({
-  menuName: '',
-  price: 0,
-  category: '',
-  description: '',
-  available: true,
-  recommended: false,
-  imageUrl: ''
-})
-
-// 메뉴 목록 (데모 데이터)
-const menus = ref([
-  {
-    id: 1,
-    menuName: '김치찌개',
-    category: '찌개류',
-    price: 8000,
-    description: '돼지고기와 신김치로 끓인 얼큰한 김치찌개',
-    available: true,
-    recommended: true,
-    imageUrl: '/images/kimchi-jjigae.jpg'
-  },
-  {
-    id: 2,
-    menuName: '된장찌개',
-    category: '찌개류',
-    price: 7000,
-    description: '집된장으로 끓인 구수한 된장찌개',
-    available: true,
-    recommended: false,
-    imageUrl: '/images/doenjang-jjigae.jpg'
-  },
-  {
-    id: 3,
-    menuName: '제육볶음',
-    category: '볶음류',
-    price: 12000,
-    description: '매콤달콤한 양념에 볶은 제육볶음',
-    available: false,
-    recommended: true,
-    imageUrl: '/images/jeyuk-bokkeum.jpg'
-  }
-])
-
-// 컴퓨티드 속성
-const storeInfo = computed(() => storeStore.storeInfo || {})
-
-const availableMenusCount = computed(() => 
-  menus.value.filter(menu => menu.available).length
-)
-
-const recommendedMenusCount = computed(() => 
-  menus.value.filter(menu => menu.recommended).length
-)
-
-const averagePrice = computed(() => {
-  if (menus.value.length === 0) return '0원'
-  const total = menus.value.reduce((sum, menu) => sum + menu.price, 0)
-  const average = Math.round(total / menus.value.length)
-  return formatCurrency(average)
-})
-
-const filteredMenus = computed(() => {
-  let filtered = menus.value
-
-  // 검색 필터
-  if (menuSearch.value) {
-    filtered = filtered.filter(menu =>
-      menu.menuName.toLowerCase().includes(menuSearch.value.toLowerCase()) ||
-      menu.description.toLowerCase().includes(menuSearch.value.toLowerCase())
-    )
-  }
-
-  // 카테고리 필터
-  if (menuCategoryFilter.value !== '전체') {
-    filtered = filtered.filter(menu => menu.category === menuCategoryFilter.value)
-  }
-
-  // 상태 필터
-  if (menuStatusFilter.value !== '전체') {
-    const isAvailable = menuStatusFilter.value === '판매중'
-    filtered = filtered.filter(menu => menu.available === isAvailable)
-  }
-
-  return filtered
-})
-
-const menuCategories = computed(() => {
-  const categories = [...new Set(menus.value.map(menu => menu.category))]
-  return categories.sort()
-})
-
-// 선택 옵션
+// 선택 옵션들
 const businessTypes = [
-  '한식', '중식', '일식', '양식', '분식', '치킨', '피자', '버거',
-  '카페', '디저트', '술집', '기타'
+  '카페', '레스토랑', '베이커리', '디저트', '주점', '패스트푸드', '기타'
 ]
 
-const daysOfWeek = [
+const weekDays = [
   { title: '월요일', value: 'monday' },
   { title: '화요일', value: 'tuesday' },
   { title: '수요일', value: 'wednesday' },
@@ -1120,23 +863,206 @@ const daysOfWeek = [
   { title: '일요일', value: 'sunday' }
 ]
 
-// 유효성 검사 규칙
-const businessNumberRules = [
-  v => !!v || '사업자등록번호를 입력해주세요',
-  v => /^\d{3}-\d{2}-\d{5}$/.test(v) || '올바른 사업자등록번호 형식이 아닙니다 (예: 123-45-67890)'
-]
+// 컴퓨티드 속성
+const storeInfo = computed(() => storeStore.storeInfo || {})
 
-const phoneRules = [
-  v => !!v || '연락처를 입력해주세요',
-  v => /^[0-9-+\s()]+$/.test(v) || '올바른 연락처 형식이 아닙니다'
-]
+// 메뉴 관련 컴퓨티드 속성
+const filteredMenus = computed(() => {
+  let filtered = menus.value
 
-const priceRules = [
-  v => !!v || '가격을 입력해주세요',
-  v => v > 0 || '가격은 0보다 커야 합니다'
-]
+  // 검색 필터
+  if (menuSearch.value) {
+    const search = menuSearch.value.toLowerCase()
+    filtered = filtered.filter(menu => 
+      menu.menuName.toLowerCase().includes(search) ||
+      menu.description.toLowerCase().includes(search)
+    )
+  }
+
+  // 카테고리 필터
+  if (menuCategoryFilter.value && menuCategoryFilter.value !== '전체') {
+    filtered = filtered.filter(menu => menu.category === menuCategoryFilter.value)
+  }
+
+  return filtered
+})
+
+// 유틸리티 함수들
+const formatClosedDays = (closedDays) => {
+  if (!closedDays) return '미설정'
+  
+  if (typeof closedDays === 'string') {
+    return closedDays
+  }
+  
+  if (Array.isArray(closedDays)) {
+    const dayNames = {
+      'monday': '월요일',
+      'tuesday': '화요일', 
+      'wednesday': '수요일',
+      'thursday': '목요일',
+      'friday': '금요일',
+      'saturday': '토요일',
+      'sunday': '일요일'
+    }
+    
+    return closedDays.map(day => dayNames[day] || day).join(', ') || '연중무휴'
+  }
+  
+  return '미설정'
+}
+
+const showSnackbar = (message, color = 'success') => {
+  snackbar.value.message = message
+  snackbar.value.color = color
+  snackbar.value.show = true
+}
+
+// 메서드들
+const openCreateDialog = () => {
+  console.log('새 매장 등록 다이얼로그 열기')
+  editMode.value = false
+  resetForm()
+  showCreateDialog.value = true
+}
+
+const editBasicInfo = () => {
+  console.log('매장 정보 수정 시작')
+  editMode.value = true
+  
+  // 기존 매장 정보로 폼 데이터 설정
+  const store = storeInfo.value
+  formData.value = {
+    storeName: store.storeName || '',
+    businessType: store.businessType || '',
+    address: store.address || '',
+    phoneNumber: store.phoneNumber || '',
+    seatCount: store.seatCount || 0,
+    instagramUrl: store.instaAccounts || '',
+    blogUrl: store.blogAccounts || '',
+    openTime: store.openTime || '09:00',
+    closeTime: store.closeTime || '21:00',
+    holidays: store.holidays || [],
+    description: store.description || ''
+  }
+  
+  showCreateDialog.value = true
+}
+
+const addMenu = () => {
+  console.log('메뉴 추가 (개발 예정)')
+  showSnackbar('메뉴 관리 기능은 곧 업데이트 예정입니다', 'info')
+}
+
+// 메뉴 관련 메서드들
+const openCreateMenuDialog = () => {
+  console.log('메뉴 등록 다이얼로그 열기')
+  menuEditMode.value = false
+  resetMenuForm()
+  showMenuDialog.value = true
+}
+
+const editMenu = (menu) => {
+  console.log('메뉴 수정:', menu)
+  menuEditMode.value = true
+  
+  // 백엔드에서 받은 메뉴 데이터 구조에 맞게 설정
+  menuFormData.value = {
+    id: menu.id || menu.menuId, // 메뉴 ID 추가
+    menuName: menu.menuName || '',
+    category: menu.category || '',
+    price: menu.price || 0,
+    description: menu.description || '',
+    available: menu.available !== undefined ? menu.available : true,
+    recommended: menu.recommended !== undefined ? menu.recommended : false,
+    imageUrl: menu.imageUrl || menu.image || ''
+  }
+  
+  showMenuDialog.value = true
+}
+
+const viewMenuDetail = async (menu) => {
+  console.log('메뉴 상세 보기:', menu)
+  
+  try {
+    // 메뉴 서비스 임포트
+    const { menuService } = await import('@/services/menu')
+    
+    // 메뉴 상세 정보 조회
+    const result = await menuService.getMenuDetail(menu.id)
+    
+    if (result.success) {
+      selectedMenu.value = result.data
+      showMenuDetailDialog.value = true
+      console.log('✅ 메뉴 상세 정보 로드:', result.data)
+    } else {
+      // API 실패 시 현재 메뉴 정보 사용
+      selectedMenu.value = menu
+      showMenuDetailDialog.value = true
+      console.log('⚠️ 상세 정보 로드 실패, 기본 정보 사용:', menu)
+    }
+  } catch (error) {
+    // 오류 발생 시 현재 메뉴 정보 사용
+    console.error('메뉴 상세 정보 로드 실패:', error)
+    selectedMenu.value = menu
+    showMenuDetailDialog.value = true
+  }
+}
+
+const closeMenuDetail = () => {
+  showMenuDetailDialog.value = false
+  selectedMenu.value = null
+}
+
+const confirmDeleteMenu = (menu) => {
+  console.log('메뉴 삭제 확인:', menu)
+  if (confirm(`'${menu.menuName}' 메뉴를 삭제하시겠습니까?`)) {
+    deleteMenu(menu.id)
+  }
+}
+
+const clearFilters = () => {
+  menuSearch.value = ''
+  menuCategoryFilter.value = '전체'
+}
+
+const cancelMenuForm = () => {
+  console.log('메뉴 폼 취소')
+  showMenuDialog.value = false
+  menuEditMode.value = false
+  resetMenuForm()
+}
+
+const resetMenuForm = () => {
+  menuFormData.value = {
+    id: null, // 메뉴 ID 초기화 추가
+    menuName: '',
+    category: '',
+    price: 0,
+    description: '',
+    available: true,
+    recommended: false,
+    imageUrl: ''
+  }
+  
+  // 폼 validation 초기화
+  if (menuFormRef.value) {
+    menuFormRef.value.resetValidation()
+  }
+}
+
+const getCategoryColor = (category) => {
+  const colors = {
+    '커피': 'brown',
+    '음료': 'blue',
+    '디저트': 'pink',
+    '베이커리': 'orange',
+    '샐러드': 'green',
+    '샌드위치': 'purple'
+  }
+  return colors[category] || 'grey'
+}
 
-// 유틸리티 함수
 const formatCurrency = (amount) => {
   return new Intl.NumberFormat('ko-KR', {
     style: 'currency',
@@ -1144,195 +1070,56 @@ const formatCurrency = (amount) => {
   }).format(amount)
 }
 
-const formatHolidays = (holidays) => {
-  if (!holidays || holidays.length === 0) return '없음'
-  const dayNames = {
-    monday: '월요일',
-    tuesday: '화요일',
-    wednesday: '수요일',
-    thursday: '목요일',
-    friday: '금요일',
-    saturday: '토요일',
-    sunday: '일요일'
-  }
-  return holidays.map(day => dayNames[day]).join(', ')
-}
-
-const getCategoryColor = (category) => {
-  const colors = {
-    '면류': 'orange',
-    '튀김류': 'amber',
-    '음료': 'blue',
-    '안주': 'green',
-    '디저트': 'pink',
-    '찌개류': 'red',
-    '볶음류': 'purple'
-  }
-  return colors[category] || 'grey'
-}
-
-// 메서드
-
-/**
- * SNS 계정 연동 확인
- * @param {string} platform - SNS 플랫폼 (instagram, blog)
- */
-const checkSnsConnection = async (platform) => {
-  console.log(`${platform} 연동 확인 시작`)
-  
-  snsCheckLoading.value[platform] = true
+const formatDateTime = (dateTimeString) => {
+  if (!dateTimeString) return '-'
   
   try {
-    // 개발 모드에서는 빠른 시뮬레이션
-    const delay = import.meta.env.DEV ? 1000 : 2000
-    await new Promise(resolve => setTimeout(resolve, delay))
-    
-    // 랜덤하게 성공/실패 결정 (실제로는 API 응답에 따라 결정)
-    const isSuccess = Math.random() > 0.3
-    
-    snsConnectionResult.value.success = isSuccess
-    snsConnectionResult.value.platform = platform
-    
-    if (isSuccess) {
-      snsConnectionResult.value.message = platform === 'instagram' 
-        ? '인스타그램 계정 연동이 확인되었습니다!' 
-        : '네이버 블로그 연동이 확인되었습니다!'
-    } else {
-      snsConnectionResult.value.message = platform === 'instagram' 
-        ? '인스타그램 계정을 찾을 수 없거나 연동할 수 없습니다. URL을 확인해주세요.' 
-        : '네이버 블로그를 찾을 수 없거나 연동할 수 없습니다. URL을 확인해주세요.'
-    }
-    
-    showSnsResultDialog.value = true
-    
+    const date = new Date(dateTimeString)
+    return new Intl.DateTimeFormat('ko-KR', {
+      year: 'numeric',
+      month: '2-digit',
+      day: '2-digit',
+      hour: '2-digit',
+      minute: '2-digit'
+    }).format(date)
   } catch (error) {
-    console.error('SNS 연동 확인 중 오류:', error)
-    snsConnectionResult.value.success = false
-    snsConnectionResult.value.message = '연동 확인 중 오류가 발생했습니다. 잠시 후 다시 시도해주세요.'
-    showSnsResultDialog.value = true
-  } finally {
-    snsCheckLoading.value[platform] = false
+    return dateTimeString
   }
 }
 
-/**
- * 데모 매장 데이터 로드 (개발용)
- */
-const loadDemoStoreData = () => {
-  console.log('데모 매장 데이터 로드')
-  
-  // 데모 매장 정보 설정
-  const demoStoreInfo = {
-    id: 1,
-    storeName: '김씨네 분식점',
-    businessType: '분식',
-    ownerName: '김점주',
-    businessNumber: '123-45-67890',
-    address: '서울특별시 강남구 테헤란로 123',
-    phoneNumber: '02-1234-5678',
-    seatCount: 20,
-    instagramUrl: '@kimfood_bunsik',
-    blogUrl: 'blog.naver.com/kimfood123',
-    openTime: '09:00',
-    closeTime: '21:00',
-    holidays: ['sunday'],
-    deliveryAvailable: true,
-    takeoutAvailable: true,
-    imageUrl: '/images/store-demo.jpg'
-  }
-  
-  // 스토어에 데모 데이터 직접 설정
-  storeStore.storeInfo = demoStoreInfo
-  
-  showSnackbar('데모 매장 정보가 로드되었습니다', 'success')
-}
-
-/**
- * 기본 정보 수정 모드로 전환
- */
-const editBasicInfo = () => {
-  editMode.value = true
-  
-  // 현재 매장 정보를 폼 데이터에 복사
-  Object.assign(formData.value, {
-    storeName: storeInfo.value.storeName || '',
-    businessType: storeInfo.value.businessType || '',
-    ownerName: storeInfo.value.ownerName || '',
-    businessNumber: storeInfo.value.businessNumber || '',
-    address: storeInfo.value.address || '',
-    phoneNumber: storeInfo.value.phoneNumber || '',
-    seatCount: storeInfo.value.seatCount || 0,
-    instagramUrl: storeInfo.value.instagramUrl || '',
-    blogUrl: storeInfo.value.blogUrl || '',
-    openTime: storeInfo.value.openTime || '09:00',
-    closeTime: storeInfo.value.closeTime || '21:00',
-    holidays: storeInfo.value.holidays || [],
-    deliveryAvailable: storeInfo.value.deliveryAvailable || false,
-    takeoutAvailable: storeInfo.value.takeoutAvailable || true,
-    imageUrl: storeInfo.value.imageUrl || ''
-  })
-  
-  showCreateDialog.value = true
-}
-
-/**
- * 이미지 선택
- */
-const selectImage = () => {
-  imageInput.value?.click()
-}
-
-/**
- * 이미지 업로드 처리
- */
-const handleImageUpload = (event) => {
-  const file = event.target.files[0]
-  if (file) {
-    // 실제로는 서버에 업로드하고 URL을 받아옴
-    const reader = new FileReader()
-    reader.onload = (e) => {
-      formData.value.imageUrl = e.target.result
-    }
-    reader.readAsDataURL(file)
-  }
-}
-
-/**
- * 매장 정보 저장
- */
-const saveStoreInfo = async () => {
-  if (!storeForm.value?.validate()) return
-
-  console.log('매장 정보 저장:', storeFormData.value)
-  
-  try {
-    const result = await storeStore.saveStoreInfo(storeFormData.value)
+// 메뉴 상세에서 수정 버튼 클릭
+const editMenuFromDetail = () => {
+  if (selectedMenu.value) {
+    // 상세 다이얼로그 닫기
+    closeMenuDetail()
     
-    if (result.success) {
-      appStore.showSnackbar(result.message || '매장 정보가 저장되었습니다', 'success')
-      showStoreForm.value = false
-    } else {
-      appStore.showSnackbar(result.error || '저장에 실패했습니다', 'error')
-    }
-  } catch (error) {
-    console.error('매장 정보 저장 실패:', error)
-    appStore.showSnackbar('네트워크 오류가 발생했습니다', 'error')
+    // 수정 다이얼로그 열기
+    editMenu(selectedMenu.value)
   }
 }
 
-/**
- * 다이얼로그 닫기
- */
-const closeDialog = () => {
+// 메뉴 상세에서 삭제 버튼 클릭
+const deleteMenuFromDetail = () => {
+  if (selectedMenu.value) {
+    // 상세 다이얼로그 닫기
+    closeMenuDetail()
+    
+    // 삭제 확인
+    confirmDeleteMenu(selectedMenu.value)
+  }
+}
+
+const cancelForm = () => {
+  console.log('폼 취소')
   showCreateDialog.value = false
   editMode.value = false
-  
-  // 폼 데이터 초기화
-  Object.assign(formData.value, {
+  resetForm()
+}
+
+const resetForm = () => {
+  formData.value = {
     storeName: '',
     businessType: '',
-    ownerName: '',
-    businessNumber: '',
     address: '',
     phoneNumber: '',
     seatCount: 0,
@@ -1341,307 +1128,272 @@ const closeDialog = () => {
     openTime: '09:00',
     closeTime: '21:00',
     holidays: [],
-    deliveryAvailable: false,
-    takeoutAvailable: true,
-    imageUrl: ''
-  })
-}
-
-// 메뉴 관리 메서드
-
-/**
- * 메뉴 등록 다이얼로그 열기
- */
-const openCreateMenuDialog = () => {
-  editMenuMode.value = false
-  resetMenuForm()
-  showMenuDialog.value = true
-}
-
-/**
- * 메뉴 수정
- */
-const editMenu = (menu) => {
-  editMenuMode.value = true
-  Object.assign(menuFormData.value, menu)
-  showMenuDialog.value = true
-}
-
-/**
- * 메뉴 삭제 확인
- */
-const confirmDeleteMenu = (menu) => {
-  deleteMenuTarget.value = menu
-  showDeleteMenuDialog.value = true
-}
-
-/**
- * 메뉴 이미지 선택
- */
-const selectMenuImage = () => {
-  menuImageInput.value?.click()
-}
-
-/**
- * 메뉴 이미지 업로드 처리
- */
-const handleMenuImageUpload = (event) => {
-  const file = event.target.files[0]
-  if (file) {
-    const reader = new FileReader()
-    reader.onload = (e) => {
-      menuFormData.value.imageUrl = e.target.result
-    }
-    reader.readAsDataURL(file)
+    description: ''
+  }
+  
+  // 폼 validation 초기화
+  if (storeFormRef.value) {
+    storeFormRef.value.resetValidation()
   }
 }
 
-/**
- * 메뉴 저장
- */
-const saveMenu = async () => {
-  if (!menuForm.value?.validate()) return
-
-  console.log('메뉴 저장:', menuFormData.value)
+// 매장 정보 저장 함수 - 완전히 새로 작성
+const saveStoreInfo = async () => {
+  console.log('=== 매장 정보 저장 시작 ===')
+  console.log('편집 모드:', editMode.value)
+  console.log('폼 데이터:', formData.value)
+  
+  // 폼 유효성 검사
+  if (!storeFormRef.value) {
+    console.error('폼 참조를 찾을 수 없습니다')
+    showSnackbar('폼 오류가 발생했습니다', 'error')
+    return
+  }
+  
+  const { valid } = await storeFormRef.value.validate()
+  if (!valid) {
+    console.log('폼 유효성 검사 실패')
+    showSnackbar('필수 정보를 모두 입력해주세요', 'error')
+    return
+  }
+  
+  saving.value = true
   
   try {
+    // 백엔드에 보낼 데이터 형식으로 변환
+    const storeData = {
+      storeName: formData.value.storeName,
+      businessType: formData.value.businessType,
+      address: formData.value.address,
+      phoneNumber: formData.value.phoneNumber,
+      businessHours: `${formData.value.openTime}-${formData.value.closeTime}`,
+      closedDays: Array.isArray(formData.value.holidays) ? formData.value.holidays.join(',') : '',
+      seatCount: parseInt(formData.value.seatCount) || 0,
+      instaAccounts: formData.value.instagramUrl || '',
+      blogAccounts: formData.value.blogUrl || '',
+      description: formData.value.description || ''
+    }
+    
+    console.log('백엔드로 전송할 데이터:', storeData)
+    
     let result
-    if (isMenuEdit.value && editingMenuId.value) {
-      result = await storeStore.updateMenu(editingMenuId.value, menuFormData.value)
+    if (editMode.value) {
+      // 매장 정보 수정
+      result = await storeStore.updateStore(storeInfo.value.storeId, storeData)
     } else {
-      result = await storeStore.saveMenu(menuFormData.value)
+      // 새 매장 등록
+      result = await storeStore.registerStore(storeData)
     }
     
-    if (result.success) {
-      appStore.showSnackbar(result.message || '메뉴가 저장되었습니다', 'success')
-      showMenuForm.value = false
-      resetMenuForm()
-    } else {
-      appStore.showSnackbar(result.error || '저장에 실패했습니다', 'error')
-    }
-  } catch (error) {
-    console.error('메뉴 저장 실패:', error)
-    appStore.showSnackbar('네트워크 오류가 발생했습니다', 'error')
-  }
-}
-
-/**
- * 메뉴 삭제
- */
-const deleteMenu = async (menuId) => {
-  try {
-    const result = await storeStore.deleteMenu(menuId)
+    console.log('저장 결과:', result)
     
     if (result.success) {
-      appStore.showSnackbar(result.message || '메뉴가 삭제되었습니다', 'success')
+      showSnackbar(
+        editMode.value ? '매장 정보가 수정되었습니다' : '매장이 등록되었습니다',
+        'success'
+      )
+      showCreateDialog.value = false
+      editMode.value = false
+      resetForm()
+      
+      // 매장 정보 다시 조회
+      await storeStore.fetchStoreInfo()
     } else {
-      appStore.showSnackbar(result.error || '삭제에 실패했습니다', 'error')
+      showSnackbar(result.message || '저장에 실패했습니다', 'error')
     }
   } catch (error) {
-    console.error('메뉴 삭제 실패:', error)
-    appStore.showSnackbar('네트워크 오류가 발생했습니다', 'error')
+    console.error('매장 정보 저장 중 오류:', error)
+    showSnackbar('저장 중 오류가 발생했습니다', 'error')
+  } finally {
+    saving.value = false
   }
 }
 
-/**
- * 메뉴 다이얼로그 닫기
- */
-const closeMenuDialog = () => {
-  showMenuDialog.value = false
-  editMenuMode.value = false
-  resetMenuForm()
-}
-
-/**
- * 메뉴 폼 초기화
- */
-const resetMenuForm = () => {
-  Object.assign(menuFormData.value, {
-    menuName: '',
-    price: 0,
-    category: '',
-    description: '',
-    available: true,
-    recommended: false,
-    imageUrl: ''
-  })
-}
-
-/**
- * 필터 초기화
- */
-const clearFilters = () => {
-  menuSearch.value = ''
-  menuCategoryFilter.value = '전체'
-  menuStatusFilter.value = '전체'
-}
-
-/**
- * 스낵바 표시
- */
-const showSnackbar = (message, color = 'success') => {
-  snackbar.value.message = message
-  snackbar.value.color = color
-  snackbar.value.show = true
-}
-
-// 메뉴 상세 다이얼로그 관련 상태 (기존 상태들에 추가)
-const showMenuDetailDialog = ref(false)
-const selectedMenuDetail = ref(null)
-
-// 메뉴 관리 메서드에 추가할 함수들
-
-/**
- * 메뉴 상세보기
- */
-const viewMenuDetail = (menu) => {
-  selectedMenuDetail.value = { ...menu }
-  showMenuDetailDialog.value = true
-}
-
-/**
- * 상세화면에서 수정 모드로 전환
- */
-const editFromDetail = () => {
-  showMenuDetailDialog.value = false
-  editMenuMode.value = true
-  Object.assign(menuFormData.value, selectedMenuDetail.value)
-  showMenuDialog.value = true
-}
-
 /**
  * 컴포넌트 마운트 시 실행
  */
 onMounted(async () => {
-  console.log('StoreManagementView 마운트됨')
+  console.log('=== StoreManagementView 마운트됨 ===')
   
   try {
-    // 매장 정보 로드
-    if (!storeStore.hasStoreInfo) {
-      await storeStore.fetchStoreInfo()
+    // 매장 정보 조회
+    const result = await storeStore.fetchStoreInfo()
+    
+    console.log('매장 정보 조회 결과:', result)
+    
+    if (result.success) {
+      console.log('✅ 매장 정보 로드 완료:', result.data)
+      
+      // 매장 정보가 있는 경우 메뉴 정보도 로드
+      await loadMenus()
+      
+    } else {
+      if (result.message === '등록된 매장이 없습니다') {
+        console.log('⚠️ 등록된 매장이 없음 - 등록 화면 표시')
+        // 매장이 없는 경우는 정상적인 상황이므로 에러 메시지 표시하지 않음
+      } else {
+        console.warn('❌ 매장 정보 조회 실패:', result.message)
+        showSnackbar(result.message || '매장 정보를 불러오는데 실패했습니다', 'error')
+      }
     }
-    
-    // 메뉴 목록 로드
-    await storeStore.fetchMenus()
-    
   } catch (error) {
-    console.warn('매장 관리 데이터 로드 실패 (개발 중이므로 무시):', error)
+    console.error('매장 정보 조회 중 예외 발생:', error)
+    showSnackbar('매장 정보를 불러오는 중 오류가 발생했습니다', 'error')
   }
 })
+
+// 메뉴 데이터 로드 함수 - 실제 API 연동
+const loadMenus = async () => {
+  try {
+    console.log('메뉴 데이터 로드 시작')
+    const result = await storeStore.fetchMenus()
+    
+    if (result.success) {
+      menus.value = result.data
+      console.log('✅ 메뉴 데이터 로드 완료:', result.data)
+    } else {
+      console.log('메뉴 데이터 없음 또는 로드 실패:', result.message)
+      menus.value = [] // 빈 배열로 설정 (빈 상태 UI 표시)
+    }
+  } catch (error) {
+    console.error('메뉴 데이터 로드 실패:', error)
+    menus.value = [] // 빈 배열로 초기화
+  }
+}
+
+// 실제 메뉴 등록/수정 함수
+const saveMenu = async () => {
+  if (!menuFormRef.value) {
+    showSnackbar('폼 오류가 발생했습니다', 'error')
+    return
+  }
+  
+  const { valid } = await menuFormRef.value.validate()
+  if (!valid) {
+    showSnackbar('필수 정보를 모두 입력해주세요', 'error')
+    return
+  }
+  
+  saving.value = true
+  
+  try {
+    // 메뉴 서비스 임포트
+    const { menuService } = await import('@/services/menu')
+    
+    let result
+    
+    if (menuEditMode.value) {
+      // 메뉴 수정 - PUT /api/menu/{menuId}
+      const menuId = menuFormData.value.id
+      if (!menuId) {
+        showSnackbar('메뉴 ID가 없습니다', 'error')
+        return
+      }
+      
+      console.log('메뉴 수정 API 호출, 메뉴 ID:', menuId)
+      result = await menuService.updateMenu(menuId, menuFormData.value)
+    } else {
+      // 새 메뉴 등록 - POST /api/menu/register
+      const storeId = storeInfo.value.storeId
+      if (!storeId) {
+        showSnackbar('매장 정보를 찾을 수 없습니다', 'error')
+        return
+      }
+      
+      // 메뉴 데이터 준비 (매장 ID 포함)
+      const menuData = {
+        ...menuFormData.value,
+        storeId: storeId
+      }
+      
+      console.log('메뉴 등록 API 호출, 매장 ID:', storeId)
+      result = await menuService.registerMenu(menuData)
+    }
+    
+    console.log('메뉴 저장 결과:', result)
+    
+    if (result.success) {
+      showSnackbar(
+        menuEditMode.value ? '메뉴가 수정되었습니다' : '메뉴가 등록되었습니다',
+        'success'
+      )
+      showMenuDialog.value = false
+      menuEditMode.value = false
+      resetMenuForm()
+      
+      // 메뉴 목록 새로고침
+      await loadMenus()
+    } else {
+      showSnackbar(result.message || '저장에 실패했습니다', 'error')
+    }
+  } catch (error) {
+    console.error('메뉴 저장 중 오류:', error)
+    showSnackbar('저장 중 오류가 발생했습니다', 'error')
+  } finally {
+    saving.value = false
+  }
+}
+
+// 실제 메뉴 삭제 함수
+const deleteMenu = async (menuId) => {
+  try {
+    // 메뉴 서비스 임포트
+    const { menuService } = await import('@/services/menu')
+    
+    console.log('메뉴 삭제:', menuId)
+    const result = await menuService.deleteMenu(menuId)
+    
+    if (result.success) {
+      showSnackbar('메뉴가 삭제되었습니다', 'success')
+      // 메뉴 목록 새로고침
+      await loadMenus()
+    } else {
+      showSnackbar(result.message || '메뉴 삭제에 실패했습니다', 'error')
+    }
+  } catch (error) {
+    console.error('메뉴 삭제 실패:', error)
+    showSnackbar('메뉴 삭제 중 오류가 발생했습니다', 'error')
+  }
+}
 </script>
 
 <style scoped>
-/* 버튼 그룹 스타일 */
+.info-item {
+  display: flex;
+  align-items: flex-start;
+  gap: 8px;
+  margin-bottom: 16px;
+}
+
+.info-item .v-icon {
+  margin-top: 2px;
+}
+
 .gap-3 {
   gap: 12px;
 }
 
-.flex-grow-1 {
-  flex-grow: 1;
-}
-
-.d-flex.flex-column.gap-3 {
-  display: flex;
-  flex-direction: column;
-  gap: 16px;
-  align-items: center;
-}
-
-/* SNS 연동 상태 표시 */
-.sns-connection-status {
-  display: flex;
-  align-items: center;
-  gap: 8px;
-}
-
-.sns-connection-success {
-  color: rgb(76, 175, 80);
-}
-
-.sns-connection-error {
-  color: rgb(244, 67, 54);
-}
-
-/* SNS 입력 컨테이너 스타일 - 마진 추가 */
-.sns-input-container {
-  margin: 16px 0;
-}
-
-.sns-input-row {
-  display: flex !important;
-  align-items: center !important;
-  gap: 16px !important;
-  margin-bottom: 8px;
-}
-
-.sns-text-field {
-  flex: 1 !important;
-}
-
-.sns-check-btn {
-  flex-shrink: 0 !important;
-  min-width: 120px !important;
-  height: 56px !important;
-  margin-left: 16px !important;
-}
-
-/* 카드 스타일 개선 */
-.v-card {
-  border-radius: 12px;
-}
-
-.v-card-title {
-  font-weight: 600;
-}
-
-/* 탭 스타일 */
-.v-tabs {
-  background-color: transparent;
-}
-
-.v-tab {
-  font-weight: 500;
-}
-
-/* 다이얼로그 스타일 */
-.v-dialog .v-card {
-  border-radius: 16px;
-}
-
-/* 폼 스타일 */
-.v-text-field, .v-select {
-  margin-bottom: 8px;
-}
-
-/* 버튼 스타일 */
-.v-btn {
-  text-transform: none;
-  font-weight: 500;
-}
-
-/* 아바타 스타일 */
-.v-avatar {
-  border: 2px solid #e0e0e0;
-}
-
-/* 스위치 스타일 */
-.v-switch {
-  margin-top: 8px;
-}
-
-/* 칩 스타일 */
-.v-chip {
-  font-weight: 500;
-}
-
-/* 로딩 상태 */
-.v-progress-circular {
-  margin: 16px;
+.text-truncate-2 {
+  display: -webkit-box;
+  -webkit-line-clamp: 2;
+  -webkit-box-orient: vertical;
+  overflow: hidden;
 }
 
 /* 메뉴 카드 스타일 */
-.h-100 {
-  height: 100%;
+.menu-card {
+  transition: transform 0.2s ease-in-out, box-shadow 0.2s ease-in-out;
+  cursor: pointer;
+}
+
+.menu-card:hover {
+  transform: translateY(-2px);
+  box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15) !important;
+}
+
+.empty-state {
+  text-align: center;
+  padding: 3rem 1rem;
 }
 
 .position-relative {
@@ -1664,433 +1416,21 @@ onMounted(async () => {
   left: 0;
 }
 
-/* 반응형 스타일 */
+.h-100 {
+  height: 100%;
+}
+
 @media (max-width: 600px) {
-  .v-container {
-    padding: 16px 8px;
+  .info-item {
+    margin-bottom: 12px;
   }
   
-  .v-card-text {
-    padding: 16px !important;
+  .menu-card {
+    margin-bottom: 16px;
   }
   
-  .v-dialog {
-    margin: 16px;
+  .empty-state {
+    padding: 2rem 1rem;
   }
-  
-  .d-flex.gap-3 {
-    flex-direction: column;
-    gap: 16px;
-  }
-  
-  .d-flex.gap-3 .v-btn {
-    align-self: stretch;
-  }
-
-  .text-h4 {
-    font-size: 1.5rem !important;
-  }
-
-  /* 메뉴 그리드 반응형 */
-  .v-col {
-    padding: 8px;
-  }
-
-  /* SNS 입력 반응형 */
-  .sns-input-row {
-    flex-direction: column !important;
-    align-items: stretch !important;
-    gap: 12px !important;
-  }
-
-  .sns-check-btn {
-    margin-left: 0 !important;
-    width: 100% !important;
-  }
-}
-
-/* 다크 모드 지원 */
-.v-theme--dark .v-avatar {
-  border-color: #424242;
-}
-
-.v-theme--dark .v-card {
-  background-color: #1e1e1e;
-}
-
-/* 메뉴 카드 호버 효과 */
-.v-card:hover {
-  transform: translateY(-2px);
-  transition: transform 0.2s ease-in-out;
-  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
-}
-
-/* 이미지 스타일 */
-.v-img {
-  border-radius: 8px;
-}
-
-/* 메뉴 통계 카드 스타일 */
-.v-card .text-h4 {
-  line-height: 1.2;
-}
-
-.v-card .text-caption {
-  text-transform: uppercase;
-  letter-spacing: 0.5px;
-}
-
-/* 검색 및 필터 영역 */
-.v-text-field .v-field__input {
-  padding: 12px 16px;
-}
-
-/* SNS 연동 버튼 스타일 */
-.v-btn--variant-tonal {
-  border-radius: 8px;
-}
-
-/* 폼 레이아웃 개선 */
-.v-form .v-row {
-  margin: 0;
-}
-
-.v-form .v-col {
-  padding: 8px;
-}
-
-/* 알림 스타일 */
-.v-alert {
-  border-radius: 8px;
-  font-weight: 500;
-}
-
-/* 메뉴 상태 칩 스타일 */
-.v-chip--variant-elevated {
-  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
-}
-
-/* 스낵바 스타일 커스터마이징 */
-.v-snackbar {
-  font-weight: 500;
-}
-
-/* 빈 상태 스타일 */
-.grey-lighten-5 {
-  background-color: #fafafa !important;
-}
-
-/* 로딩 오버레이 스타일 */
-.v-overlay .v-progress-circular {
-  filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.2));
-}
-
-/* 탭 윈도우 애니메이션 */
-.v-tabs-window {
-  transition: all 0.3s ease-in-out;
-}
-
-/* 다이얼로그 액션 버튼 스타일 */
-.v-card-actions .v-btn {
-  min-width: 80px;
-}
-
-/* 메뉴 설명 텍스트 제한 */
-.text-body-2 {
-  display: -webkit-box;
-  -webkit-line-clamp: 2;
-  -webkit-box-orient: vertical;
-  overflow: hidden;
-}
-
-/* 가격 표시 스타일 */
-.text-primary {
-  font-family: 'Roboto Mono', monospace;
-}
-
-/* 카테고리 칩 스타일 */
-.v-chip--variant-tonal {
-  font-size: 0.75rem;
-  font-weight: 600;
-}
-
-/* 매장 정보 섹션 구분 */
-.my-6 {
-  margin-top: 24px !important;
-  margin-bottom: 24px !important;
-}
-
-/* 폼 그룹 스타일 */
-.v-col h4 {
-  color: #666;
-  font-size: 0.875rem;
-  font-weight: 600;
-  text-transform: uppercase;
-  letter-spacing: 0.5px;
-}
-
-/* 입력 필드 포커스 스타일 */
-.v-text-field .v-field--focused {
-  box-shadow: 0 0 0 2px rgba(25, 118, 210, 0.12);
-}
-
-/* 드롭다운 스타일 */
-.v-select .v-field {
-  border-radius: 8px;
-}
-
-/* 스위치 라벨 스타일 */
-.v-switch .v-label {
-  font-weight: 500;
-  color: #424242;
-}
-
-/* 이미지 업로드 영역 스타일 */
-.v-avatar .v-img {
-  border-radius: 50%;
-  object-fit: cover;
-}
-
-/* 메뉴 액션 버튼 스타일 */
-.v-btn--icon {
-  border-radius: 50%;
-}
-
-.v-btn--icon:hover {
-  background-color: rgba(0, 0, 0, 0.04);
-}
-
-/* 검색 필드 스타일 */
-.v-text-field--prepend-inner .v-field__prepend-inner {
-  padding-top: 12px;
-}
-
-/* 필터 선택 스타일 */
-.v-select .v-field__input {
-  align-items: center;
-  min-height: 56px;
-}
-
-/* 추가 스타일 개선 */
-.v-card-subtitle {
-  opacity: 0.7;
-}
-
-/* 메뉴 상태 배지 스타일 */
-.position-absolute.top-0.right-0 {
-  z-index: 1;
-}
-
-.position-absolute.top-0.left-0 {
-  z-index: 1;
-}
-
-/* 메뉴 정보 레이아웃 */
-.v-card-text .d-flex {
-  align-items: flex-start;
-}
-
-/* 텍스트 트렁케이션 */
-.text-truncate {
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-}
-
-.text-truncate-2 {
-  display: -webkit-box;
-  -webkit-line-clamp: 2;
-  -webkit-box-orient: vertical;
-  overflow: hidden;
-}
-
-/* 그리드 레이아웃 개선 */
-.v-row .v-col {
-  display: flex;
-  align-items: stretch;
-}
-
-/* 통계 카드 스타일 개선 */
-.text-center.pa-4 {
-  border-left: 4px solid transparent;
-  transition: border-color 0.3s ease;
-}
-
-.text-center.pa-4:hover {
-  border-left-color: #1976d2;
-}
-
-/* 폼 섹션 구분선 */
-.form-section {
-  border-bottom: 1px solid #e0e0e0;
-  padding-bottom: 24px;
-  margin-bottom: 24px;
-}
-
-.form-section:last-child {
-  border-bottom: none;
-  margin-bottom: 0;
-}
-
-/* 액션 버튼 그룹 */
-.action-buttons {
-  display: flex;
-  gap: 8px;
-}
-
-/* 상태 표시자 */
-.status-indicator {
-  width: 8px;
-  height: 8px;
-  border-radius: 50%;
-  display: inline-block;
-  margin-right: 8px;
-}
-
-.status-indicator.active {
-  background-color: #4caf50;
-}
-
-.status-indicator.inactive {
-  background-color: #f44336;
-}
-
-/* 메뉴 카드 그림자 효과 */
-.menu-card {
-  transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
-  cursor: pointer;
-}
-
-.menu-card:hover {
-  box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15);
-  transform: translateY(-4px);
-}
-
-/* 빈 상태 일러스트레이션 */
-.empty-state {
-  max-width: 400px;
-  margin: 0 auto;
-  text-align: center;
-}
-
-.empty-state .v-img {
-  opacity: 0.6;
-  filter: grayscale(20%);
-}
-
-/* 로딩 스피너 커스터마이징 */
-.loading-spinner {
-  animation: spin 1s linear infinite;
-}
-
-@keyframes spin {
-  0% { transform: rotate(0deg); }
-  100% { transform: rotate(360deg); }
-}
-
-/* 성공/에러 상태 색상 */
-.success-state {
-  color: #4caf50;
-}
-
-.error-state {
-  color: #f44336;
-}
-
-.warning-state {
-  color: #ff9800;
-}
-
-.info-state {
-  color: #2196f3;
-}
-
-/* 모바일 최적화 추가 */
-@media (max-width: 960px) {
-  .v-card-title {
-    flex-direction: column;
-    align-items: flex-start !important;
-    gap: 16px;
-  }
-  
-  .v-card-title .v-btn {
-    align-self: stretch;
-  }
-}
-
-@media (max-width: 480px) {
-  .v-container {
-    padding: 8px !important;
-  }
-  
-  .v-card {
-    margin: 0 !important;
-  }
-  
-  .v-dialog {
-    margin: 8px !important;
-  }
-  
-  .v-card-text {
-    padding: 12px !important;
-  }
-}
-
-/* 접근성 개선 */
-.v-btn:focus {
-  outline: 2px solid #2196f3;
-  outline-offset: 2px;
-}
-
-.v-text-field:focus-within {
-  transform: scale(1.01);
-  transition: transform 0.2s ease;
-}
-
-/* 다크테마 추가 지원 */
-.v-theme--dark .form-section {
-  border-bottom-color: #424242;
-}
-
-.v-theme--dark .status-indicator.active {
-  background-color: #66bb6a;
-}
-
-.v-theme--dark .status-indicator.inactive {
-  background-color: #ef5350;
-}
-
-/* 인쇄 스타일 */
-@media print {
-  .v-btn, .v-dialog, .v-overlay {
-    display: none !important;
-  }
-  
-  .v-card {
-    box-shadow: none !important;
-    border: 1px solid #ccc;
-  }
-}
-
-/* 메뉴 상세 다이얼로그 스타일 */
-.menu-detail-card {
-  border-radius: 16px;
-}
-
-.menu-detail-info {
-  background: linear-gradient(135deg, #f5f7fa 0%, #c3cfe2 100%);
-  border-radius: 12px;
-  padding: 16px;
-}
-
-/* 스위치 그룹 레이아웃 */
-.d-flex.gap-4 {
-  gap: 24px;
-}
-
-/* 메뉴 정보 카드 호버 효과 */
-.v-card[variant="tonal"]:hover {
-  transform: scale(1.02);
-  transition: transform 0.2s ease;
 }
 </style>
\ No newline at end of file