release
This commit is contained in:
parent
48959bf242
commit
388ff7cbcb
@ -1,3 +1,4 @@
|
|||||||
|
//* src/views/StoreManagementView.vue
|
||||||
<template>
|
<template>
|
||||||
<v-container fluid class="pa-4">
|
<v-container fluid class="pa-4">
|
||||||
<!-- 매장 정보가 없는 경우 -->
|
<!-- 매장 정보가 없는 경우 -->
|
||||||
@ -141,16 +142,7 @@
|
|||||||
<p class="text-body-1">{{ storeInfo.instagramUrl || '등록되지 않음' }}</p>
|
<p class="text-body-1">{{ storeInfo.instagramUrl || '등록되지 않음' }}</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<v-btn
|
|
||||||
v-if="storeInfo.instagramUrl"
|
|
||||||
color="purple"
|
|
||||||
size="small"
|
|
||||||
variant="tonal"
|
|
||||||
@click="checkSnsConnection('instagram')"
|
|
||||||
:loading="snsCheckLoading.instagram"
|
|
||||||
>
|
|
||||||
연동 확인
|
|
||||||
</v-btn>
|
|
||||||
</div>
|
</div>
|
||||||
</v-col>
|
</v-col>
|
||||||
|
|
||||||
@ -163,16 +155,7 @@
|
|||||||
<p class="text-body-1">{{ storeInfo.blogUrl || '등록되지 않음' }}</p>
|
<p class="text-body-1">{{ storeInfo.blogUrl || '등록되지 않음' }}</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<v-btn
|
|
||||||
v-if="storeInfo.blogUrl"
|
|
||||||
color="green"
|
|
||||||
size="small"
|
|
||||||
variant="tonal"
|
|
||||||
@click="checkSnsConnection('naver_blog')"
|
|
||||||
:loading="snsCheckLoading.naver_blog"
|
|
||||||
>
|
|
||||||
연동 확인
|
|
||||||
</v-btn>
|
|
||||||
</div>
|
</div>
|
||||||
</v-col>
|
</v-col>
|
||||||
</v-row>
|
</v-row>
|
||||||
@ -369,18 +352,18 @@
|
|||||||
icon
|
icon
|
||||||
size="small"
|
size="small"
|
||||||
variant="text"
|
variant="text"
|
||||||
@click.stop="editMenu(menu)"
|
color="error"
|
||||||
|
@click.stop="confirmDeleteMenu(menu)"
|
||||||
>
|
>
|
||||||
<v-icon size="small">mdi-pencil</v-icon>
|
<v-icon size="small">mdi-delete</v-icon>
|
||||||
</v-btn>
|
</v-btn>
|
||||||
<v-btn
|
<v-btn
|
||||||
icon
|
icon
|
||||||
size="small"
|
size="small"
|
||||||
variant="text"
|
variant="text"
|
||||||
color="error"
|
@click.stop="editMenu(menu)"
|
||||||
@click.stop="confirmDeleteMenu(menu)"
|
|
||||||
>
|
>
|
||||||
<v-icon size="small">mdi-delete</v-icon>
|
<v-icon size="small">mdi-pencil</v-icon>
|
||||||
</v-btn>
|
</v-btn>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@ -586,77 +569,79 @@
|
|||||||
/>
|
/>
|
||||||
</v-col>
|
</v-col>
|
||||||
|
|
||||||
<!-- SNS 정보 섹션 -->
|
</v-row>
|
||||||
<div class="form-section">
|
|
||||||
<h3 class="text-h6 font-weight-bold mb-4">SNS 계정 정보</h3>
|
|
||||||
|
|
||||||
<v-row>
|
|
||||||
<!-- 인스타그램 -->
|
|
||||||
<v-col cols="12">
|
|
||||||
<div class="d-flex align-center mb-2">
|
|
||||||
<v-icon color="purple" class="mr-2">mdi-instagram</v-icon>
|
|
||||||
<span class="text-subtitle-2 font-weight-medium">인스타그램</span>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="d-flex gap-2 align-center">
|
|
||||||
<v-text-field
|
|
||||||
v-model="formData.instagramUrl"
|
|
||||||
placeholder="@계정명 또는 URL 입력"
|
|
||||||
variant="outlined"
|
|
||||||
density="comfortable"
|
|
||||||
prepend-inner-icon="mdi-at"
|
|
||||||
hide-details="auto"
|
|
||||||
class="flex-grow-1"
|
|
||||||
style="min-width: 300px;"
|
|
||||||
/>
|
|
||||||
<v-btn
|
|
||||||
color="purple"
|
|
||||||
variant="tonal"
|
|
||||||
:loading="snsCheckLoading.instagram"
|
|
||||||
@click="checkSnsConnection('instagram')"
|
|
||||||
style="min-width: 80px; flex-shrink: 0;"
|
|
||||||
>
|
|
||||||
연동 확인
|
|
||||||
</v-btn>
|
|
||||||
</div>
|
|
||||||
</v-col>
|
|
||||||
|
|
||||||
<!-- 네이버 블로그 -->
|
<!-- SNS 정보 섹션 -->
|
||||||
<v-col cols="12">
|
<v-divider class="my-4" />
|
||||||
<div class="d-flex align-center mb-2">
|
<h3 class="text-h6 font-weight-bold mb-6">SNS 계정 정보</h3>
|
||||||
<v-icon color="green" class="mr-2">mdi-web</v-icon>
|
|
||||||
<span class="text-subtitle-2 font-weight-medium">네이버 블로그</span>
|
<!-- 인스타그램 -->
|
||||||
</div>
|
<div class="mb-6">
|
||||||
|
<div class="d-flex align-center mb-3">
|
||||||
<div class="d-flex gap-2 align-center">
|
<v-icon color="purple" class="mr-2">mdi-instagram</v-icon>
|
||||||
<v-text-field
|
<span class="text-subtitle-2 font-weight-medium">인스타그램</span>
|
||||||
v-model="formData.blogUrl"
|
|
||||||
placeholder="blog.naver.com/계정명 형식으로 입력"
|
|
||||||
variant="outlined"
|
|
||||||
density="comfortable"
|
|
||||||
prepend-inner-icon="mdi-web"
|
|
||||||
hide-details="auto"
|
|
||||||
class="flex-grow-1"
|
|
||||||
style="min-width: 300px;"
|
|
||||||
/>
|
|
||||||
<v-btn
|
|
||||||
color="green"
|
|
||||||
variant="tonal"
|
|
||||||
:loading="snsCheckLoading.blog"
|
|
||||||
@click="checkSnsConnection('blog')"
|
|
||||||
style="min-width: 80px; flex-shrink: 0;"
|
|
||||||
>
|
|
||||||
연동 확인
|
|
||||||
</v-btn>
|
|
||||||
</div>
|
|
||||||
</v-col>
|
|
||||||
</v-row>
|
|
||||||
</div>
|
</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>
|
||||||
|
|
||||||
<!-- 운영 정보 -->
|
<!-- 네이버 블로그 -->
|
||||||
<v-col cols="12">
|
<div class="mb-6">
|
||||||
<h4 class="text-subtitle-1 font-weight-bold mb-3">운영 정보</h4>
|
<div class="d-flex align-center mb-3">
|
||||||
</v-col>
|
<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-col cols="12" sm="6">
|
||||||
<v-text-field
|
<v-text-field
|
||||||
@ -736,9 +721,8 @@
|
|||||||
scrollable
|
scrollable
|
||||||
>
|
>
|
||||||
<v-card>
|
<v-card>
|
||||||
<v-card-title class="pa-4">
|
<v-card-title class="pa-4 d-flex align-center justify-space-between">
|
||||||
<span class="text-h6">{{ editMenuMode ? '메뉴 수정' : '메뉴 등록' }}</span>
|
<span class="text-h6">{{ editMenuMode ? '메뉴 수정' : '메뉴 등록' }}</span>
|
||||||
<v-spacer />
|
|
||||||
<v-btn
|
<v-btn
|
||||||
icon
|
icon
|
||||||
@click="closeMenuDialog"
|
@click="closeMenuDialog"
|
||||||
@ -894,9 +878,8 @@
|
|||||||
<!-- 메뉴 상세 다이얼로그 -->
|
<!-- 메뉴 상세 다이얼로그 -->
|
||||||
<v-dialog v-model="showMenuDetailDialog" max-width="500">
|
<v-dialog v-model="showMenuDetailDialog" max-width="500">
|
||||||
<v-card class="menu-detail-card">
|
<v-card class="menu-detail-card">
|
||||||
<v-card-title class="pa-4">
|
<v-card-title class="pa-4 d-flex align-center justify-space-between">
|
||||||
<span class="text-h6">메뉴 상세 정보</span>
|
<span class="text-h6">메뉴 상세 정보</span>
|
||||||
<v-spacer />
|
|
||||||
<v-btn
|
<v-btn
|
||||||
icon
|
icon
|
||||||
@click="showMenuDetailDialog = false"
|
@click="showMenuDetailDialog = false"
|
||||||
@ -1030,7 +1013,7 @@ const menuStatusFilter = ref('전체')
|
|||||||
// SNS 연동 관련 상태
|
// SNS 연동 관련 상태
|
||||||
const snsCheckLoading = ref({
|
const snsCheckLoading = ref({
|
||||||
instagram: false,
|
instagram: false,
|
||||||
naver_blog: false
|
blog: false
|
||||||
})
|
})
|
||||||
const showSnsResultDialog = ref(false)
|
const showSnsResultDialog = ref(false)
|
||||||
const snsConnectionResult = ref({
|
const snsConnectionResult = ref({
|
||||||
@ -1229,7 +1212,7 @@ const getCategoryColor = (category) => {
|
|||||||
|
|
||||||
/**
|
/**
|
||||||
* SNS 계정 연동 확인
|
* SNS 계정 연동 확인
|
||||||
* @param {string} platform - SNS 플랫폼 (instagram, naver_blog)
|
* @param {string} platform - SNS 플랫폼 (instagram, blog)
|
||||||
*/
|
*/
|
||||||
const checkSnsConnection = async (platform) => {
|
const checkSnsConnection = async (platform) => {
|
||||||
console.log(`${platform} 연동 확인 시작`)
|
console.log(`${platform} 연동 확인 시작`)
|
||||||
@ -1677,6 +1660,29 @@ onMounted(async () => {
|
|||||||
color: rgb(244, 67, 54);
|
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 {
|
.v-card {
|
||||||
border-radius: 12px;
|
border-radius: 12px;
|
||||||
@ -1787,6 +1793,18 @@ onMounted(async () => {
|
|||||||
.v-col {
|
.v-col {
|
||||||
padding: 8px;
|
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;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
/* 다크 모드 지원 */
|
/* 다크 모드 지원 */
|
||||||
@ -2173,21 +2191,4 @@ onMounted(async () => {
|
|||||||
transform: scale(1.02);
|
transform: scale(1.02);
|
||||||
transition: transform 0.2s ease;
|
transition: transform 0.2s ease;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* SNS 입력 행 레이아웃 - 우선순위가 높은 스타일 */
|
|
||||||
.sns-input-row {
|
|
||||||
display: flex !important;
|
|
||||||
align-items: center !important;
|
|
||||||
gap: 12px !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
.sns-text-field {
|
|
||||||
flex: 1 !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
.sns-check-btn {
|
|
||||||
flex-shrink: 0 !important;
|
|
||||||
min-width: 120px !important;
|
|
||||||
height: 56px !important;
|
|
||||||
}
|
|
||||||
</style>
|
</style>
|
||||||
Loading…
x
Reference in New Issue
Block a user