Compare commits
73 Commits
test
...
5fcdd7f06d
| Author | SHA1 | Date | |
|---|---|---|---|
| 5fcdd7f06d | |||
| 1e149f7e41 | |||
| aca3767a24 | |||
| d51655f15e | |||
| 47dd32939f | |||
| 2e1891ab08 | |||
| 99d70cc8f7 | |||
| 9f1675e82d | |||
| c2838be2ed | |||
| b5c2941c0d | |||
| d5c01d8d23 | |||
| 7118b0649a | |||
| 8f5346581e | |||
| e43f2e30be | |||
| 397fd267e0 | |||
| fe4b88350b | |||
| 537474e162 | |||
| b5abdf3cf5 | |||
| a2e457b5e8 | |||
| 05ddd417cd | |||
| e70426af68 | |||
| 81b33e1322 | |||
| 588fcfbe90 | |||
| ff2c126382 | |||
| 702daca29f | |||
| 8e9008a3c1 | |||
| 5c0c00aad4 | |||
| e0949c6d73 | |||
| 0449bac8d5 | |||
| d412c15c9d | |||
| ed16a6ddad | |||
| f06e2d41e0 | |||
| 7505269db3 | |||
| 15eeb6943d | |||
| 7e7ed46cea | |||
| fd01786649 | |||
| c48c1c2f09 | |||
| 9bcf3a3cdb | |||
| 4c5b987d98 | |||
| f168403048 | |||
| 82ee1584e7 | |||
| 65cb918389 | |||
| 784baf9a2f | |||
| 7a85ac41cc | |||
| 9d4c9437cf | |||
| 68845aeae1 | |||
| bbdca29337 | |||
| c14c041daa | |||
| a515a144eb | |||
| 54a6773905 | |||
| d97087b4e9 | |||
| ddb2449053 | |||
| 8aca07cdf7 | |||
| 0ba845d95a | |||
| 64b1fd5395 | |||
| 639bea70fa | |||
| 6a89ba059b | |||
| ff83041585 | |||
| e660be0bf4 | |||
| 62cdd57069 | |||
| f8346ed5ef | |||
| 9656b9a9d1 | |||
| 97a58266bb | |||
| 8fc0cfa345 | |||
| 22f9c2287d | |||
| 9284f7d5c3 | |||
| e6f27a4529 | |||
| 6a33d1c024 | |||
| 3b83789c15 | |||
| 55f0ab9af3 | |||
| 9b168a6112 | |||
| c47937933e | |||
| 4744fe7d9a |
@@ -1,89 +1,34 @@
|
||||
import Vue from "vue";
|
||||
import Vue from 'vue';
|
||||
|
||||
async function getAudioContentSeriesList(page) {
|
||||
return Vue.axios.get("/admin/audio-content/series?page=" + (page - 1) + "&size=10");
|
||||
return Vue.axios.get("/admin/audio-content/series?page=" + (page - 1) + "&size=10");
|
||||
}
|
||||
|
||||
async function getAudioContentSeriesGenreList() {
|
||||
return Vue.axios.get("/admin/audio-content/series/genre");
|
||||
return Vue.axios.get('/admin/audio-content/series/genre');
|
||||
}
|
||||
|
||||
async function createAudioContentSeriesGenre(genre, is_adult) {
|
||||
return Vue.axios.post("/admin/audio-content/series/genre", { genre: genre, isAdult: is_adult });
|
||||
return Vue.axios.post('/admin/audio-content/series/genre', {genre: genre, isAdult: is_adult})
|
||||
}
|
||||
|
||||
async function updateAudioContentSeriesGenre(request) {
|
||||
return Vue.axios.put("/admin/audio-content/series/genre", request);
|
||||
return Vue.axios.put('/admin/audio-content/series/genre', request)
|
||||
}
|
||||
|
||||
async function updateAudioContentSeriesGenreOrders(ids) {
|
||||
return Vue.axios.put("/admin/audio-content/series/genre/orders", { ids: ids });
|
||||
return Vue.axios.put('/admin/audio-content/series/genre/orders', {ids: ids})
|
||||
}
|
||||
|
||||
async function searchSeriesList(searchWord) {
|
||||
return Vue.axios.get("/admin/audio-content/series/search?search_word=" + searchWord);
|
||||
}
|
||||
|
||||
// 시리즈 수정
|
||||
async function updateAudioContentSeries(request) {
|
||||
return Vue.axios.put("/admin/audio-content/series", request);
|
||||
}
|
||||
|
||||
// ========================
|
||||
// 시리즈 배너 API
|
||||
// ========================
|
||||
// 배너 리스트 조회
|
||||
async function getSeriesBannerList(page = 1, size = 20) {
|
||||
return Vue.axios.get("/admin/audio-content/series/banner/list", {
|
||||
params: { page: page - 1, size }
|
||||
});
|
||||
}
|
||||
|
||||
// 배너 등록
|
||||
async function createSeriesBanner(bannerData) {
|
||||
const formData = new FormData();
|
||||
if (bannerData.image) formData.append("image", bannerData.image);
|
||||
const requestData = { seriesId: bannerData.seriesId };
|
||||
formData.append("request", JSON.stringify(requestData));
|
||||
return Vue.axios.post("/admin/audio-content/series/banner/register", formData, {
|
||||
headers: { "Content-Type": "multipart/form-data" }
|
||||
});
|
||||
}
|
||||
|
||||
// 배너 수정
|
||||
async function updateSeriesBanner(bannerData) {
|
||||
const formData = new FormData();
|
||||
if (bannerData.image) formData.append("image", bannerData.image);
|
||||
const requestData = { seriesId: bannerData.seriesId, bannerId: bannerData.bannerId };
|
||||
formData.append("request", JSON.stringify(requestData));
|
||||
return Vue.axios.put("/admin/audio-content/series/banner/update", formData, {
|
||||
headers: { "Content-Type": "multipart/form-data" }
|
||||
});
|
||||
}
|
||||
|
||||
// 배너 삭제
|
||||
async function deleteSeriesBanner(bannerId) {
|
||||
// 백엔드 사양이 불명확하여 쿼리 파라미터로 전송
|
||||
return Vue.axios.delete("/admin/audio-content/series/banner/" + bannerId);
|
||||
}
|
||||
|
||||
// 배너 순서 변경
|
||||
async function updateSeriesBannerOrder(ids) {
|
||||
return Vue.axios.put("/admin/audio-content/series/banner/orders", { ids });
|
||||
return Vue.axios.get("/admin/audio-content/series/search?search_word=" + searchWord)
|
||||
}
|
||||
|
||||
export {
|
||||
getAudioContentSeriesList,
|
||||
getAudioContentSeriesGenreList,
|
||||
createAudioContentSeriesGenre,
|
||||
updateAudioContentSeriesGenre,
|
||||
updateAudioContentSeriesGenreOrders,
|
||||
searchSeriesList,
|
||||
updateAudioContentSeries,
|
||||
// series banner
|
||||
getSeriesBannerList,
|
||||
createSeriesBanner,
|
||||
updateSeriesBanner,
|
||||
deleteSeriesBanner,
|
||||
updateSeriesBannerOrder
|
||||
};
|
||||
getAudioContentSeriesList,
|
||||
getAudioContentSeriesGenreList,
|
||||
createAudioContentSeriesGenre,
|
||||
updateAudioContentSeriesGenre,
|
||||
updateAudioContentSeriesGenreOrders,
|
||||
searchSeriesList
|
||||
}
|
||||
|
||||
@@ -24,7 +24,7 @@ async function getCalculateCommunityPost(startDate, endDate, page, size) {
|
||||
}
|
||||
|
||||
async function getSettlementRatio(page) {
|
||||
return Vue.axios.get('/admin/calculate/ratio?page=' + (page - 1) + "&size=20");
|
||||
return Vue.axios.get('/admin/calculate/ratio?page=' + (page - 1) + "&size=20'");
|
||||
}
|
||||
|
||||
async function createCreatorSettlementRatio(creatorSettlementRatio) {
|
||||
@@ -57,21 +57,6 @@ async function getCalculateCommunityByCreator(startDate, endDate, page, size) {
|
||||
)
|
||||
}
|
||||
|
||||
async function updateCreatorSettlementRatio(creatorSettlementRatio) {
|
||||
const request = {
|
||||
memberId: creatorSettlementRatio.creator_id,
|
||||
subsidy: creatorSettlementRatio.subsidy,
|
||||
liveSettlementRatio: creatorSettlementRatio.liveSettlementRatio,
|
||||
contentSettlementRatio: creatorSettlementRatio.contentSettlementRatio,
|
||||
communitySettlementRatio: creatorSettlementRatio.communitySettlementRatio
|
||||
};
|
||||
return Vue.axios.post('/admin/calculate/ratio/update', request);
|
||||
}
|
||||
|
||||
async function deleteCreatorSettlementRatio(memberId) {
|
||||
return Vue.axios.post('/admin/calculate/ratio/delete/' + memberId);
|
||||
}
|
||||
|
||||
export {
|
||||
getCalculateLive,
|
||||
getCalculateContent,
|
||||
@@ -80,8 +65,6 @@ export {
|
||||
getCalculateCommunityPost,
|
||||
getSettlementRatio,
|
||||
createCreatorSettlementRatio,
|
||||
updateCreatorSettlementRatio,
|
||||
deleteCreatorSettlementRatio,
|
||||
getCalculateLiveByCreator,
|
||||
getCalculateContentByCreator,
|
||||
getCalculateCommunityByCreator
|
||||
|
||||
@@ -5,16 +5,16 @@ async function deleteCan(id) {
|
||||
}
|
||||
|
||||
async function getCans() {
|
||||
return Vue.axios.get('/admin/can');
|
||||
return Vue.axios.get('/can');
|
||||
}
|
||||
|
||||
async function insertCan(can, rewardCan, price, currency) {
|
||||
const request = {can: can, rewardCan: rewardCan, price: price, currency}
|
||||
async function insertCan(can, rewardCan, price) {
|
||||
const request = {can: can, rewardCan: rewardCan, price: price}
|
||||
return Vue.axios.post('/admin/can', request);
|
||||
}
|
||||
|
||||
async function paymentCan(can, method, memberIds) {
|
||||
const request = {memberIds: memberIds, method: method, can: can}
|
||||
async function paymentCan(can, method, member_id) {
|
||||
const request = {memberId: member_id, method: method, can: can}
|
||||
return Vue.axios.post('/admin/can/charge', request)
|
||||
}
|
||||
|
||||
|
||||
@@ -7,20 +7,13 @@ async function getCharacterList(page = 1, size = 20) {
|
||||
})
|
||||
}
|
||||
|
||||
// 캐릭터 검색 (배너용 기존 함수)
|
||||
// 캐릭터 검색
|
||||
async function searchCharacters(searchTerm, page = 1, size = 20) {
|
||||
return Vue.axios.get('/admin/chat/banner/search-character', {
|
||||
params: { searchTerm, page: page - 1, size }
|
||||
})
|
||||
}
|
||||
|
||||
// 캐릭터 리스트 검색 (요구사항: /admin/chat/character/search)
|
||||
async function searchCharacterList(searchTerm, page = 1, size = 20) {
|
||||
return Vue.axios.get('/admin/chat/character/search', {
|
||||
params: { searchTerm, page: page - 1, size }
|
||||
})
|
||||
}
|
||||
|
||||
// 캐릭터 상세 조회
|
||||
async function getCharacter(id) {
|
||||
return Vue.axios.get(`/admin/chat/character/${id}`)
|
||||
@@ -50,7 +43,8 @@ async function createCharacter(characterData) {
|
||||
gender: toNullIfBlank(characterData.gender),
|
||||
mbti: toNullIfBlank(characterData.mbti),
|
||||
characterType: toNullIfBlank(characterData.type),
|
||||
originalWorkId: characterData.originalWorkId || null,
|
||||
originalTitle: toNullIfBlank(characterData.originalTitle),
|
||||
originalLink: toNullIfBlank(characterData.originalLink),
|
||||
speechPattern: toNullIfBlank(characterData.speechPattern),
|
||||
speechStyle: toNullIfBlank(characterData.speechStyle),
|
||||
appearance: toNullIfBlank(characterData.appearance),
|
||||
@@ -253,18 +247,9 @@ async function getCharactersInCuration(curationId) {
|
||||
return Vue.axios.get(`/admin/chat/character/curation/${curationId}/characters`)
|
||||
}
|
||||
|
||||
// 캐릭터별 정산 목록
|
||||
// params: { startDateStr, endDateStr, sort, page, size }
|
||||
async function getCharacterCalculateList({ startDateStr, endDateStr, sort = 'TOTAL_SALES_DESC', page = 0, size = 30 }) {
|
||||
return Vue.axios.get('/admin/chat/calculate/characters', {
|
||||
params: { startDateStr, endDateStr, sort, page, size }
|
||||
})
|
||||
}
|
||||
|
||||
export {
|
||||
getCharacterList,
|
||||
searchCharacters,
|
||||
searchCharacterList,
|
||||
getCharacter,
|
||||
createCharacter,
|
||||
updateCharacter,
|
||||
@@ -288,6 +273,5 @@ export {
|
||||
addCharacterToCuration,
|
||||
removeCharacterFromCuration,
|
||||
updateCurationCharactersOrder,
|
||||
getCharactersInCuration,
|
||||
getCharacterCalculateList
|
||||
getCharactersInCuration
|
||||
}
|
||||
|
||||
@@ -4,11 +4,8 @@ async function getChargeStatus(startDate, endDate) {
|
||||
return Vue.axios.get('/admin/charge/status?startDateStr=' + startDate + '&endDateStr=' + endDate);
|
||||
}
|
||||
|
||||
async function getChargeStatusDetail(startDate, paymentGateway, currency) {
|
||||
return Vue.axios.get('/admin/charge/status/detail?startDateStr=' + startDate
|
||||
+ '&paymentGateway=' + paymentGateway
|
||||
+ '¤cy=' + currency
|
||||
);
|
||||
async function getChargeStatusDetail(startDate, paymentGateway) {
|
||||
return Vue.axios.get('/admin/charge/status/detail?startDateStr=' + startDate + '&paymentGateway=' + paymentGateway);
|
||||
}
|
||||
|
||||
export { getChargeStatus, getChargeStatusDetail }
|
||||
|
||||
@@ -52,40 +52,13 @@ async function resetPassword(id) {
|
||||
return Vue.axios.post("/admin/member/password/reset", request)
|
||||
}
|
||||
|
||||
/**
|
||||
* 닉네임으로 회원 검색 API
|
||||
* - 서버 구현 차이를 흡수하기 위해 nickname, search_word 두 파라미터 모두 전송
|
||||
* - 응답은 다음 두 형태를 모두 허용하고 배열로 정규화하여 반환
|
||||
* 1) [{ id, nickname }, ...]
|
||||
* 2) { data: [{ id, nickname }, ...] }
|
||||
* @param {string} query
|
||||
* @returns {Promise<Array<{id:number,nickname:string}>>}
|
||||
*/
|
||||
async function searchMembersByNickname(query) {
|
||||
try {
|
||||
const res = await Vue.axios.get('/admin/member/search-by-nickname', {
|
||||
params: { search_word: query }
|
||||
})
|
||||
if (res && Array.isArray(res.data)) {
|
||||
return res.data
|
||||
}
|
||||
if (res && res.data && Array.isArray(res.data.data)) {
|
||||
return res.data.data
|
||||
}
|
||||
return []
|
||||
} catch (e) {
|
||||
return []
|
||||
}
|
||||
}
|
||||
|
||||
export {
|
||||
login,
|
||||
getMemberList,
|
||||
searchMember,
|
||||
getCreatorList,
|
||||
searchCreator,
|
||||
updateMember,
|
||||
getCreatorAllList,
|
||||
resetPassword,
|
||||
searchMembersByNickname
|
||||
login,
|
||||
getMemberList,
|
||||
searchMember,
|
||||
getCreatorList,
|
||||
searchCreator,
|
||||
updateMember,
|
||||
getCreatorAllList,
|
||||
resetPassword
|
||||
}
|
||||
|
||||
@@ -1,87 +0,0 @@
|
||||
import Vue from 'vue';
|
||||
|
||||
// 공통: 값 그대로 전달 (빈 문자열 유지)
|
||||
function toNullIfBlank(value) {
|
||||
if (typeof value === 'string') {
|
||||
return value.trim() === '' ? null : value;
|
||||
}
|
||||
return value === '' ? null : value;
|
||||
}
|
||||
|
||||
// 원작 리스트
|
||||
export async function getOriginalList(page = 1, size = 20) {
|
||||
return Vue.axios.get('/admin/chat/original/list', {
|
||||
params: { page: page - 1, size }
|
||||
})
|
||||
}
|
||||
|
||||
// 원작 등록
|
||||
export async function createOriginal(data) {
|
||||
const formData = new FormData();
|
||||
if (data.image) formData.append('image', data.image);
|
||||
const request = {
|
||||
title: toNullIfBlank(data.title),
|
||||
contentType: toNullIfBlank(data.contentType),
|
||||
category: toNullIfBlank(data.category),
|
||||
isAdult: !!data.isAdult,
|
||||
description: toNullIfBlank(data.description),
|
||||
originalLink: toNullIfBlank(data.originalLink), // 원천 원작 링크
|
||||
originalWork: toNullIfBlank(data.originalWork),
|
||||
writer: toNullIfBlank(data.writer),
|
||||
studio: toNullIfBlank(data.studio),
|
||||
originalLinks: Array.isArray(data.originalLinks) ? data.originalLinks : [],
|
||||
tags: Array.isArray(data.tags) ? data.tags : []
|
||||
};
|
||||
formData.append('request', JSON.stringify(request));
|
||||
return Vue.axios.post('/admin/chat/original/register', formData, {
|
||||
headers: { 'Content-Type': 'multipart/form-data' }
|
||||
})
|
||||
}
|
||||
|
||||
// 원작 수정
|
||||
export async function updateOriginal(data, image = null) {
|
||||
const formData = new FormData();
|
||||
if (image) formData.append('image', image);
|
||||
const processed = {};
|
||||
Object.keys(data).forEach(key => {
|
||||
processed[key] = data[key];
|
||||
})
|
||||
formData.append('request', JSON.stringify(processed));
|
||||
return Vue.axios.put('/admin/chat/original/update', formData, {
|
||||
headers: { 'Content-Type': 'multipart/form-data' }
|
||||
})
|
||||
}
|
||||
|
||||
// 원작 삭제
|
||||
export async function deleteOriginal(id) {
|
||||
return Vue.axios.delete(`/admin/chat/original/${id}`)
|
||||
}
|
||||
|
||||
// 원작 상세
|
||||
export async function getOriginal(id) {
|
||||
return Vue.axios.get(`/admin/chat/original/${id}`)
|
||||
}
|
||||
|
||||
// 원작 속 캐릭터 조회
|
||||
export async function getOriginalCharacters(id, page = 1, size = 20) {
|
||||
return Vue.axios.get(`/admin/chat/original/${id}/characters`, {
|
||||
params: { page: page - 1, size }
|
||||
})
|
||||
}
|
||||
|
||||
// 원작 검색
|
||||
export async function searchOriginals(searchTerm) {
|
||||
return Vue.axios.get('/admin/chat/original/search', {
|
||||
params: { searchTerm }
|
||||
})
|
||||
}
|
||||
|
||||
// 원작에 캐릭터 연결
|
||||
export async function assignCharactersToOriginal(id, characterIds = []) {
|
||||
return Vue.axios.post(`/admin/chat/original/${id}/assign-characters`, { characterIds })
|
||||
}
|
||||
|
||||
// 원작에서 캐릭터 연결 해제
|
||||
export async function unassignCharactersFromOriginal(id, characterIds = []) {
|
||||
return Vue.axios.post(`/admin/chat/original/${id}/unassign-characters`, { characterIds })
|
||||
}
|
||||
@@ -97,26 +97,6 @@ export default {
|
||||
if (res.status === 200 && res.data.success === true && res.data.data.length > 0) {
|
||||
this.items = res.data.data
|
||||
|
||||
// '시리즈 관리' 메뉴에 '배너 등록' 하위 메뉴 추가
|
||||
try {
|
||||
const seriesMenu = this.items.find(m => m && m.title === '시리즈 관리')
|
||||
if (seriesMenu) {
|
||||
if (!Array.isArray(seriesMenu.items)) {
|
||||
seriesMenu.items = seriesMenu.items ? [].concat(seriesMenu.items) : []
|
||||
}
|
||||
const exists = seriesMenu.items.some(ci => ci && ci.route === '/content/series/banner')
|
||||
if (!exists) {
|
||||
seriesMenu.items.push({
|
||||
title: '배너 등록',
|
||||
route: '/content/series/banner',
|
||||
items: null
|
||||
})
|
||||
}
|
||||
}
|
||||
} catch (e) {
|
||||
// ignore
|
||||
}
|
||||
|
||||
// 캐릭터 챗봇 메뉴 추가
|
||||
this.items.push({
|
||||
title: '캐릭터 챗봇',
|
||||
@@ -136,17 +116,7 @@ export default {
|
||||
title: '큐레이션',
|
||||
route: '/character/curation',
|
||||
items: null
|
||||
},
|
||||
{
|
||||
title: '정산',
|
||||
route: '/character/calculate',
|
||||
items: null
|
||||
},
|
||||
{
|
||||
title: '원작',
|
||||
route: '/original-work',
|
||||
items: null
|
||||
},
|
||||
}
|
||||
]
|
||||
})
|
||||
} else {
|
||||
|
||||
@@ -120,11 +120,6 @@ const routes = [
|
||||
name: 'ContentSeriesRecommendFree',
|
||||
component: () => import(/* webpackChunkName: "series" */ '../views/Series/ContentSeriesRecommendFree.vue')
|
||||
},
|
||||
{
|
||||
path: '/content/series/banner',
|
||||
name: 'ContentSeriesBanner',
|
||||
component: () => import(/* webpackChunkName: "series" */ '../views/Series/ContentSeriesBanner.vue')
|
||||
},
|
||||
{
|
||||
path: '/promotion/event',
|
||||
name: 'EventView',
|
||||
@@ -295,26 +290,6 @@ const routes = [
|
||||
name: 'CharacterCurationDetail',
|
||||
component: () => import(/* webpackChunkName: "character" */ '../views/Chat/CharacterCurationDetail.vue')
|
||||
},
|
||||
{
|
||||
path: '/character/calculate',
|
||||
name: 'CharacterCalculate',
|
||||
component: () => import(/* webpackChunkName: "character" */ '../views/Chat/CharacterCalculateList.vue')
|
||||
},
|
||||
{
|
||||
path: '/original-work',
|
||||
name: 'OriginalList',
|
||||
component: () => import(/* webpackChunkName: "original" */ '../views/Chat/OriginalList.vue')
|
||||
},
|
||||
{
|
||||
path: '/original-work/form',
|
||||
name: 'OriginalForm',
|
||||
component: () => import(/* webpackChunkName: "original" */ '../views/Chat/OriginalForm.vue')
|
||||
},
|
||||
{
|
||||
path: '/original-work/detail',
|
||||
name: 'OriginalDetail',
|
||||
component: () => import(/* webpackChunkName: "original" */ '../views/Chat/OriginalDetail.vue')
|
||||
},
|
||||
]
|
||||
},
|
||||
{
|
||||
|
||||
@@ -8,29 +8,11 @@
|
||||
|
||||
<br>
|
||||
<v-container>
|
||||
<v-autocomplete
|
||||
v-model="selectedMembers"
|
||||
:items="displaySearchItems"
|
||||
:loading="searchLoading"
|
||||
:search-input.sync="searchQuery"
|
||||
label="닉네임으로 사용자 검색 (여러 명 선택 가능)"
|
||||
item-text="nickname"
|
||||
item-value="id"
|
||||
return-object
|
||||
multiple
|
||||
small-chips
|
||||
clearable
|
||||
outlined
|
||||
cache-items
|
||||
:value-comparator="compareMember"
|
||||
@update:search-input="onSearch"
|
||||
/>
|
||||
|
||||
<v-text-field
|
||||
v-model="manualInput"
|
||||
label="회원번호 직접 입력 (여러 개 입력 가능, 콤마/공백 구분)"
|
||||
v-model="account_id"
|
||||
label="회원번호"
|
||||
outlined
|
||||
clearable
|
||||
required
|
||||
/>
|
||||
|
||||
<v-text-field
|
||||
@@ -52,7 +34,7 @@
|
||||
<v-col>
|
||||
<v-btn
|
||||
block
|
||||
color="#3bb9f1"
|
||||
color="#9970ff"
|
||||
dark
|
||||
depressed
|
||||
@click="confirm"
|
||||
@@ -70,7 +52,7 @@
|
||||
<v-card>
|
||||
<v-card-title>캔 지급 확인</v-card-title>
|
||||
<v-card-text>
|
||||
지급 대상: {{ confirmTargets.join(', ') }}
|
||||
회원번호: {{ account_id }}
|
||||
</v-card-text>
|
||||
<v-card-text>
|
||||
기록내용: {{ method }}
|
||||
@@ -106,7 +88,6 @@
|
||||
|
||||
<script>
|
||||
import * as api from '@/api/can'
|
||||
import { searchMembersByNickname } from '@/api/member'
|
||||
|
||||
export default {
|
||||
name: "CanCharge",
|
||||
@@ -115,60 +96,12 @@ export default {
|
||||
return {
|
||||
show_confirm: false,
|
||||
is_loading: false,
|
||||
// 기존 account_id -> member_id로 명칭 변경 및 다중 입력 구조로 변경
|
||||
selectedMembers: [], // 검색으로 선택된 사용자 {id, nickname} 객체 배열
|
||||
searchItems: [],
|
||||
searchLoading: false,
|
||||
searchQuery: '',
|
||||
searchDebounceTimer: null,
|
||||
lastSearchToken: 0,
|
||||
manualInput: '', // 수동 입력: 회원번호 여러 개 (콤마/공백 구분)
|
||||
account_id: '',
|
||||
method: '',
|
||||
can: ''
|
||||
}
|
||||
},
|
||||
|
||||
computed: {
|
||||
// 확인 다이얼로그에 표시할 대상 이름들
|
||||
confirmTargets() {
|
||||
const names = []
|
||||
// 검색으로 선택된 사용자 닉네임
|
||||
if (this.selectedMembers && this.selectedMembers.length > 0) {
|
||||
names.push(...this.selectedMembers.map(m => m.nickname))
|
||||
}
|
||||
// 수동 입력 회원번호는 번호 그대로 표기
|
||||
const manualIds = this.parseManualIds()
|
||||
if (manualIds.length > 0) {
|
||||
names.push(...manualIds.map(String))
|
||||
}
|
||||
return names
|
||||
},
|
||||
// 검색 결과 목록에 현재 선택된 사용자들을 항상 포함시켜
|
||||
// 선택 chip이 사라지지 않도록 보장
|
||||
displaySearchItems() {
|
||||
const map = new Map()
|
||||
;(this.selectedMembers || []).forEach(m => {
|
||||
if (m && (m.id !== undefined && m.id !== null)) {
|
||||
map.set(String(m.id), m)
|
||||
}
|
||||
})
|
||||
;(this.searchItems || []).forEach(m => {
|
||||
if (m && (m.id !== undefined && m.id !== null)) {
|
||||
const key = String(m.id)
|
||||
if (!map.has(key)) map.set(key, m)
|
||||
}
|
||||
})
|
||||
return Array.from(map.values())
|
||||
}
|
||||
},
|
||||
|
||||
beforeDestroy() {
|
||||
if (this.searchDebounceTimer) {
|
||||
clearTimeout(this.searchDebounceTimer)
|
||||
this.searchDebounceTimer = null
|
||||
}
|
||||
},
|
||||
|
||||
methods: {
|
||||
notifyError(message) {
|
||||
this.$dialog.notify.error(message)
|
||||
@@ -178,91 +111,19 @@ export default {
|
||||
this.$dialog.notify.success(message)
|
||||
},
|
||||
|
||||
// v-autocomplete의 선택 비교를 id 기준으로 수행
|
||||
compareMember(a, b) {
|
||||
if (a === b) return true
|
||||
if (!a || !b) return false
|
||||
const aid = typeof a === 'object' ? a.id : a
|
||||
const bid = typeof b === 'object' ? b.id : b
|
||||
if (aid === undefined || bid === undefined || aid === null || bid === null) return false
|
||||
return String(aid) === String(bid)
|
||||
},
|
||||
|
||||
onSearch(val) {
|
||||
this.searchQuery = val
|
||||
|
||||
// 입력이 없으면 즉시 초기화하고 이전 타이머/로딩을 정리
|
||||
if (!val || val.trim().length === 0) {
|
||||
if (this.searchDebounceTimer) {
|
||||
clearTimeout(this.searchDebounceTimer)
|
||||
this.searchDebounceTimer = null
|
||||
}
|
||||
this.searchLoading = false
|
||||
this.searchItems = []
|
||||
return
|
||||
}
|
||||
|
||||
// 디바운스: 입력 멈춘 뒤에만 호출
|
||||
if (this.searchDebounceTimer) {
|
||||
clearTimeout(this.searchDebounceTimer)
|
||||
this.searchDebounceTimer = null
|
||||
}
|
||||
|
||||
this.searchDebounceTimer = setTimeout(async () => {
|
||||
if (val.trim().length >= 2) {
|
||||
const token = ++this.lastSearchToken
|
||||
this.searchLoading = true
|
||||
try {
|
||||
const items = await searchMembersByNickname(val)
|
||||
// 가장 최근 쿼리에 대한 응답만 반영
|
||||
if (token === this.lastSearchToken) {
|
||||
this.searchItems = items
|
||||
}
|
||||
} catch (e) {
|
||||
if (token === this.lastSearchToken) {
|
||||
this.searchItems = []
|
||||
}
|
||||
} finally {
|
||||
if (token === this.lastSearchToken) {
|
||||
this.searchLoading = false
|
||||
}
|
||||
}
|
||||
}
|
||||
}, 300)
|
||||
},
|
||||
|
||||
parseManualIds() {
|
||||
if (!this.manualInput) return []
|
||||
return this.manualInput
|
||||
.split(/[\s,]+/)
|
||||
.map(s => s.trim())
|
||||
.filter(s => s.length > 0 && /^\d+$/.test(s))
|
||||
.map(s => Number(s))
|
||||
},
|
||||
|
||||
buildMemberIds() {
|
||||
const idsFromSearch = (this.selectedMembers || []).map(m => Number(m.id)).filter(id => !isNaN(id))
|
||||
const idsFromManual = this.parseManualIds()
|
||||
// 중복 제거
|
||||
const set = new Set([...idsFromSearch, ...idsFromManual])
|
||||
return Array.from(set)
|
||||
},
|
||||
|
||||
confirm() {
|
||||
// 유효성 검증
|
||||
if (this.account_id.trim() === '' || isNaN(this.account_id)) {
|
||||
return this.notifyError('캔을 지급할 회원의 회원번호를 입력하세요.')
|
||||
}
|
||||
|
||||
if (this.method.trim() === '') {
|
||||
return this.notifyError('기록할 내용을 입력하세요')
|
||||
}
|
||||
|
||||
if (this.can === '' || isNaN(this.can)) {
|
||||
if (isNaN(this.can)) {
|
||||
return this.notifyError('캔은 숫자만 넣을 수 있습니다.')
|
||||
}
|
||||
|
||||
const memberIds = this.buildMemberIds()
|
||||
if (memberIds.length === 0) {
|
||||
return this.notifyError('캔을 지급할 대상을 추가하세요. (닉네임 검색 선택 또는 회원번호 입력)')
|
||||
}
|
||||
|
||||
if (!this.is_loading) {
|
||||
this.show_confirm = true
|
||||
}
|
||||
@@ -279,15 +140,10 @@ export default {
|
||||
try {
|
||||
this.show_confirm = false
|
||||
|
||||
const memberIds = this.buildMemberIds()
|
||||
const res = await api.paymentCan(Number(this.can), this.method, memberIds)
|
||||
const res = await api.paymentCan(Number(this.can), this.method, this.account_id)
|
||||
if (res.status === 200 && res.data.success === true) {
|
||||
this.notifySuccess('캔이 지급되었습니다.')
|
||||
// 상태 초기화
|
||||
this.selectedMembers = []
|
||||
this.searchItems = []
|
||||
this.searchQuery = ''
|
||||
this.manualInput = ''
|
||||
this.account_id = ''
|
||||
this.method = ''
|
||||
this.can = ''
|
||||
this.is_loading = false
|
||||
|
||||
@@ -21,7 +21,7 @@
|
||||
<v-col>
|
||||
<v-btn
|
||||
block
|
||||
color="#3bb9f1"
|
||||
color="#9970ff"
|
||||
dark
|
||||
depressed
|
||||
v-bind="attrs"
|
||||
@@ -39,16 +39,16 @@
|
||||
class="elevation-1"
|
||||
hide-default-footer
|
||||
>
|
||||
<template v-slot:item.priceStr="{ item }">
|
||||
{{ formatMoney(item.priceStr, item.currency) }}
|
||||
<template v-slot:item.price="{ item }">
|
||||
{{ item.price.toLocaleString('en-US') }} 원
|
||||
</template>
|
||||
|
||||
<template v-slot:item.can="{ item }">
|
||||
{{ formatNumber(item.can) }} 캔
|
||||
{{ item.can.toLocaleString('en-US') }} 캔
|
||||
</template>
|
||||
|
||||
<template v-slot:item.rewardCan="{ item }">
|
||||
{{ formatNumber(item.rewardCan) }} 캔
|
||||
{{ item.rewardCan.toLocaleString('en-US') }} 캔
|
||||
</template>
|
||||
|
||||
<template v-slot:item.management="{ item }">
|
||||
@@ -70,13 +70,7 @@
|
||||
<v-card-text>
|
||||
<v-text-field
|
||||
v-model="price"
|
||||
label="가격"
|
||||
required
|
||||
/>
|
||||
<v-select
|
||||
v-model="currency"
|
||||
:items="currencies"
|
||||
label="화폐 단위"
|
||||
label="원화"
|
||||
required
|
||||
/>
|
||||
</v-card-text>
|
||||
@@ -131,17 +125,12 @@ export default {
|
||||
price: null,
|
||||
can: null,
|
||||
reward_can: null,
|
||||
currency: 'KRW',
|
||||
currencies: [
|
||||
{ text: 'KRW (한국 원)', value: 'KRW' },
|
||||
{ text: 'USD (미국 달러)', value: 'USD' }
|
||||
],
|
||||
headers: [
|
||||
{
|
||||
text: '가격(VAT포함)',
|
||||
text: '원화(VAT포함)',
|
||||
align: 'center',
|
||||
sortable: false,
|
||||
value: 'priceStr',
|
||||
value: 'price',
|
||||
},
|
||||
{
|
||||
text: '충전캔',
|
||||
@@ -184,26 +173,9 @@ export default {
|
||||
this.can = null
|
||||
this.price = null
|
||||
this.reward_can = null
|
||||
this.currency = 'KRW'
|
||||
this.selected_can = null
|
||||
},
|
||||
|
||||
formatMoney(priceStr, currencyCode, locale = navigator.language) {
|
||||
const price = Number(priceStr);
|
||||
const formatted = new Intl.NumberFormat(locale, {
|
||||
style: 'currency',
|
||||
currency: currencyCode
|
||||
}).format(price);
|
||||
|
||||
return formatted.replace(/([^\d\s])(\d)/, '$1 $2');
|
||||
},
|
||||
|
||||
formatNumber(num) {
|
||||
return new Intl.NumberFormat(navigator.language, {
|
||||
style: 'decimal'
|
||||
}).format(num);
|
||||
},
|
||||
|
||||
async getCans() {
|
||||
this.isLoading = true
|
||||
try {
|
||||
@@ -232,14 +204,13 @@ export default {
|
||||
async submit() {
|
||||
this.isLoading = true
|
||||
|
||||
const res = await api.insertCan(this.can, this.reward_can, this.price, this.currency)
|
||||
const res = await api.insertCan(this.can, this.reward_can, this.price)
|
||||
|
||||
if (res.status === 200 && res.data.success === true) {
|
||||
this.show_dialog = false
|
||||
this.can = null
|
||||
this.price = null
|
||||
this.reward_can = null
|
||||
this.currency = 'KRW'
|
||||
this.selected_can = null
|
||||
this.notifySuccess(res.data.message || '등록되었습니다.')
|
||||
|
||||
|
||||
@@ -62,7 +62,7 @@
|
||||
</template>
|
||||
|
||||
<template v-slot:item.chargeAmount="{ item }">
|
||||
{{ formatMoney(item.chargeAmount, item.currency) }}
|
||||
{{ item.chargeAmount.toLocaleString() }} 원
|
||||
</template>
|
||||
|
||||
<template v-slot:item.locale="{ item }">
|
||||
@@ -107,7 +107,7 @@
|
||||
</template>
|
||||
|
||||
<template v-slot:item.amount="{ item }">
|
||||
{{ formatMoney(item.amount, item.locale) }}
|
||||
{{ item.amount.toLocaleString() }} 원
|
||||
</template>
|
||||
|
||||
<template v-slot:item.datetime="{ item }">
|
||||
@@ -204,12 +204,6 @@ export default {
|
||||
sortable: false,
|
||||
value: 'chargeCount',
|
||||
},
|
||||
{
|
||||
text: '화폐단위',
|
||||
align: 'center',
|
||||
sortable: false,
|
||||
value: 'currency',
|
||||
},
|
||||
{
|
||||
text: 'PG',
|
||||
sortable: false,
|
||||
@@ -254,15 +248,6 @@ export default {
|
||||
this.show_popup_dialog = false
|
||||
},
|
||||
|
||||
formatMoney(price, currencyCode, locale = navigator.language) {
|
||||
const formatted = new Intl.NumberFormat(locale, {
|
||||
style: 'currency',
|
||||
currency: currencyCode
|
||||
}).format(price);
|
||||
|
||||
return formatted.replace(/([^\d\s])(\d)/, '$1 $2');
|
||||
},
|
||||
|
||||
async getChargeStatus() {
|
||||
this.is_loading = true
|
||||
|
||||
@@ -286,7 +271,7 @@ export default {
|
||||
this.is_loading = true
|
||||
|
||||
try {
|
||||
const res = await api.getChargeStatusDetail(value.date, value.pg, value.currency)
|
||||
const res = await api.getChargeStatusDetail(value.date, value.pg)
|
||||
if (res.status === 200 && res.data.success === true) {
|
||||
this.detail_items = res.data.data
|
||||
this.show_popup_dialog = true
|
||||
|
||||
@@ -60,7 +60,7 @@
|
||||
max-width="300"
|
||||
>
|
||||
<v-img
|
||||
:src="banner.imagePath"
|
||||
:src="banner.imageUrl"
|
||||
height="200"
|
||||
contain
|
||||
/>
|
||||
|
||||
@@ -1,315 +0,0 @@
|
||||
<template>
|
||||
<div>
|
||||
<v-toolbar dark>
|
||||
<v-spacer />
|
||||
<v-toolbar-title>캐릭터 정산</v-toolbar-title>
|
||||
<v-spacer />
|
||||
</v-toolbar>
|
||||
|
||||
<v-container>
|
||||
<v-row class="justify-center align-center text-center">
|
||||
<v-col
|
||||
cols="12"
|
||||
md="3"
|
||||
>
|
||||
<v-menu
|
||||
ref="menuStart"
|
||||
v-model="menuStart"
|
||||
:close-on-content-click="false"
|
||||
transition="scale-transition"
|
||||
offset-y
|
||||
min-width="auto"
|
||||
>
|
||||
<template v-slot:activator="{ on, attrs }">
|
||||
<v-text-field
|
||||
v-model="filters.startDateStr"
|
||||
label="시작일"
|
||||
readonly
|
||||
dense
|
||||
v-bind="attrs"
|
||||
clearable
|
||||
v-on="on"
|
||||
/>
|
||||
</template>
|
||||
<v-date-picker
|
||||
v-model="filters.startDateStr"
|
||||
:max="filters.endDateStr && filters.endDateStr < todayStr ? filters.endDateStr : todayStr"
|
||||
locale="ko-kr"
|
||||
@input="$refs.menuStart.save(filters.startDateStr)"
|
||||
/>
|
||||
</v-menu>
|
||||
</v-col>
|
||||
<v-col
|
||||
cols="12"
|
||||
md="3"
|
||||
>
|
||||
<v-menu
|
||||
ref="menuEnd"
|
||||
v-model="menuEnd"
|
||||
:close-on-content-click="false"
|
||||
transition="scale-transition"
|
||||
offset-y
|
||||
min-width="auto"
|
||||
>
|
||||
<template v-slot:activator="{ on, attrs }">
|
||||
<v-text-field
|
||||
v-model="filters.endDateStr"
|
||||
label="종료일"
|
||||
readonly
|
||||
dense
|
||||
v-bind="attrs"
|
||||
clearable
|
||||
v-on="on"
|
||||
/>
|
||||
</template>
|
||||
<v-date-picker
|
||||
v-model="filters.endDateStr"
|
||||
:min="filters.startDateStr"
|
||||
:max="todayStr"
|
||||
locale="ko-kr"
|
||||
@input="$refs.menuEnd.save(filters.endDateStr)"
|
||||
/>
|
||||
</v-menu>
|
||||
</v-col>
|
||||
<v-col
|
||||
cols="12"
|
||||
md="3"
|
||||
>
|
||||
<v-select
|
||||
v-model="filters.sort"
|
||||
:items="sortItems"
|
||||
label="정렬"
|
||||
item-text="text"
|
||||
item-value="value"
|
||||
dense
|
||||
/>
|
||||
</v-col>
|
||||
<v-col
|
||||
cols="12"
|
||||
md="3"
|
||||
class="d-flex justify-center align-center"
|
||||
>
|
||||
<v-btn
|
||||
color="primary"
|
||||
small
|
||||
:loading="is_loading"
|
||||
@click="fetchList(1)"
|
||||
>
|
||||
조회
|
||||
</v-btn>
|
||||
<v-btn
|
||||
class="ml-2"
|
||||
text
|
||||
small
|
||||
@click="resetFilters"
|
||||
>
|
||||
초기화
|
||||
</v-btn>
|
||||
</v-col>
|
||||
</v-row>
|
||||
|
||||
<v-row>
|
||||
<v-col>
|
||||
<v-simple-table class="elevation-10 text-center">
|
||||
<template>
|
||||
<thead>
|
||||
<tr>
|
||||
<th class="text-center">
|
||||
이미지
|
||||
</th>
|
||||
<th class="text-center">
|
||||
캐릭터명
|
||||
</th>
|
||||
<th class="text-center">
|
||||
이미지 단독 구매(캔)
|
||||
</th>
|
||||
<th class="text-center">
|
||||
메시지 구매(캔)
|
||||
</th>
|
||||
<th class="text-center">
|
||||
채팅 횟수 구매(캔)
|
||||
</th>
|
||||
<th class="text-center">
|
||||
합계(캔)
|
||||
</th>
|
||||
<th class="text-center">
|
||||
합계(원화)
|
||||
</th>
|
||||
<th class="text-center">
|
||||
정산금액(원)
|
||||
</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr
|
||||
v-for="item in items"
|
||||
:key="item.characterId"
|
||||
>
|
||||
<td align="center">
|
||||
<v-img
|
||||
:src="item.characterImage"
|
||||
max-width="64"
|
||||
max-height="64"
|
||||
class="rounded-circle"
|
||||
contain
|
||||
/>
|
||||
</td>
|
||||
<td class="text-center">
|
||||
{{ item.name }}
|
||||
</td>
|
||||
<td class="text-center">
|
||||
{{ formatNumber(item.imagePurchaseCan) }}
|
||||
</td>
|
||||
<td class="text-center">
|
||||
{{ formatNumber(item.messagePurchaseCan) }}
|
||||
</td>
|
||||
<td class="text-center">
|
||||
{{ formatNumber(item.quotaPurchaseCan) }}
|
||||
</td>
|
||||
<td class="text-center font-weight-bold">
|
||||
{{ formatNumber(item.totalCan) }}
|
||||
</td>
|
||||
<td class="text-center">
|
||||
{{ formatCurrency(item.totalKrw) }}
|
||||
</td>
|
||||
<td class="text-center font-weight-bold">
|
||||
{{ formatCurrency(item.settlementKrw) }}
|
||||
</td>
|
||||
</tr>
|
||||
<tr v-if="!is_loading && items.length === 0">
|
||||
<td
|
||||
colspan="7"
|
||||
class="text-center grey--text"
|
||||
>
|
||||
데이터가 없습니다.
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</template>
|
||||
</v-simple-table>
|
||||
</v-col>
|
||||
</v-row>
|
||||
|
||||
<v-row class="text-center">
|
||||
<v-col>
|
||||
<v-pagination
|
||||
v-model="page"
|
||||
:length="total_page"
|
||||
circle
|
||||
@input="onPageChange"
|
||||
/>
|
||||
</v-col>
|
||||
</v-row>
|
||||
</v-container>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { getCharacterCalculateList } from "@/api/character";
|
||||
|
||||
function formatDate(date) {
|
||||
const pad = (n) => n.toString().padStart(2, "0");
|
||||
return `${date.getFullYear()}-${pad(date.getMonth() + 1)}-${pad(date.getDate())}`;
|
||||
}
|
||||
|
||||
export default {
|
||||
name: "CharacterCalculateList",
|
||||
data() {
|
||||
const today = new Date();
|
||||
const sevenDaysAgo = new Date();
|
||||
sevenDaysAgo.setDate(today.getDate() - 7);
|
||||
|
||||
return {
|
||||
is_loading: false,
|
||||
menuStart: false,
|
||||
menuEnd: false,
|
||||
todayStr: formatDate(today),
|
||||
page: 1,
|
||||
size: 30,
|
||||
total_page: 1,
|
||||
total_count: 0,
|
||||
items: [],
|
||||
sortItems: [
|
||||
{ text: "매출순", value: "TOTAL_SALES_DESC" },
|
||||
{ text: "최신캐릭터순", value: "LATEST_DESC" }
|
||||
],
|
||||
filters: {
|
||||
startDateStr: formatDate(new Date(today.getFullYear(), today.getMonth(), 1)),
|
||||
endDateStr: formatDate(today),
|
||||
sort: "TOTAL_SALES_DESC"
|
||||
}
|
||||
};
|
||||
},
|
||||
created() {
|
||||
this.fetchList(1);
|
||||
},
|
||||
methods: {
|
||||
notifyError(message) {
|
||||
this.$dialog && this.$dialog.notify ? this.$dialog.notify.error(message) : alert(message);
|
||||
},
|
||||
onPageChange() {
|
||||
this.fetchList(this.page);
|
||||
},
|
||||
resetFilters() {
|
||||
const today = new Date();
|
||||
// 이번 달 1일로 시작일 설정
|
||||
const firstDay = new Date(today.getFullYear(), today.getMonth(), 1);
|
||||
this.filters.startDateStr = formatDate(firstDay);
|
||||
// 종료일은 오늘
|
||||
this.filters.endDateStr = formatDate(today);
|
||||
this.filters.sort = "TOTAL_SALES_DESC";
|
||||
// 페이지를 1로 리셋하고 목록 조회
|
||||
this.fetchList(1);
|
||||
},
|
||||
async fetchList(page = 1) {
|
||||
if (this.is_loading) return;
|
||||
this.is_loading = true;
|
||||
try {
|
||||
const params = {
|
||||
startDateStr: this.filters.startDateStr || null,
|
||||
endDateStr: this.filters.endDateStr || null,
|
||||
sort: this.filters.sort,
|
||||
page: (page - 1),
|
||||
size: this.size
|
||||
};
|
||||
const res = await getCharacterCalculateList(params);
|
||||
if (res && res.status === 200) {
|
||||
const data = res.data && res.data.data ? res.data.data : res.data;
|
||||
if (data) {
|
||||
this.total_count = data.totalCount || 0;
|
||||
this.items = data.items || [];
|
||||
const totalPage = Math.ceil(this.total_count / this.size);
|
||||
this.total_page = totalPage > 0 ? totalPage : 1;
|
||||
this.page = page;
|
||||
} else {
|
||||
this.items = [];
|
||||
this.total_count = 0;
|
||||
this.total_page = 1;
|
||||
}
|
||||
} else {
|
||||
this.notifyError("목록 조회 중 오류가 발생했습니다.");
|
||||
}
|
||||
} catch (e) {
|
||||
console.error("정산 목록 조회 오류:", e);
|
||||
this.notifyError("알 수 없는 오류가 발생했습니다. 다시 시도해 주세요.");
|
||||
} finally {
|
||||
this.is_loading = false;
|
||||
}
|
||||
},
|
||||
formatNumber(n) {
|
||||
const num = Number(n || 0);
|
||||
return num.toLocaleString("ko-KR");
|
||||
},
|
||||
formatCurrency(n) {
|
||||
const num = Number(n || 0);
|
||||
return num.toLocaleString("ko-KR");
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.v-simple-table {
|
||||
width: 100%;
|
||||
}
|
||||
</style>
|
||||
@@ -10,29 +10,9 @@
|
||||
<v-spacer />
|
||||
<v-toolbar-title>{{ isEdit ? '캐릭터 수정' : '캐릭터 등록' }}</v-toolbar-title>
|
||||
<v-spacer />
|
||||
<v-btn
|
||||
small
|
||||
outlined
|
||||
color="primary"
|
||||
@click="exportToJson"
|
||||
>
|
||||
JSON 다운로드
|
||||
</v-btn>
|
||||
<input
|
||||
ref="importInput"
|
||||
type="file"
|
||||
accept="application/json,.json"
|
||||
style="display:none"
|
||||
@change="onImportFileChange"
|
||||
>
|
||||
<v-btn
|
||||
small
|
||||
color="primary"
|
||||
class="ml-2"
|
||||
@click="$refs.importInput.click()"
|
||||
>
|
||||
JSON 업로드
|
||||
</v-btn>
|
||||
<v-btn small outlined color="primary" @click="exportToJson">JSON 다운로드</v-btn>
|
||||
<input ref="importInput" type="file" accept="application/json,.json" style="display:none" @change="onImportFileChange" />
|
||||
<v-btn small color="primary" class="ml-2" @click="$refs.importInput.click()">JSON 업로드</v-btn>
|
||||
</v-toolbar>
|
||||
|
||||
<v-container>
|
||||
@@ -206,64 +186,29 @@
|
||||
</v-col>
|
||||
</v-row>
|
||||
|
||||
<!-- 원작 선택 -->
|
||||
<!-- 원작 정보 -->
|
||||
<v-row>
|
||||
<v-col cols="12">
|
||||
<v-autocomplete
|
||||
v-model="selectedOriginalId"
|
||||
:items="originalOptions"
|
||||
:loading="originalLoading"
|
||||
:search-input.sync="originalSearchTerm"
|
||||
item-text="title"
|
||||
item-value="id"
|
||||
label="원작 검색 후 선택"
|
||||
hide-no-data
|
||||
hide-selected
|
||||
clearable
|
||||
<v-col
|
||||
cols="12"
|
||||
md="6"
|
||||
>
|
||||
<v-text-field
|
||||
v-model="character.originalTitle"
|
||||
label="원작명"
|
||||
outlined
|
||||
dense
|
||||
@change="onOriginalChange"
|
||||
>
|
||||
<template v-slot:item="{ item, on, attrs }">
|
||||
<v-list-item
|
||||
v-bind="attrs"
|
||||
v-on="on"
|
||||
>
|
||||
<v-list-item-avatar>
|
||||
<v-img :src="item.imageUrl" />
|
||||
</v-list-item-avatar>
|
||||
<v-list-item-content>
|
||||
<v-list-item-title v-text="item.title" />
|
||||
<v-list-item-subtitle v-text="item.category" />
|
||||
</v-list-item-content>
|
||||
</v-list-item>
|
||||
</template>
|
||||
</v-autocomplete>
|
||||
/>
|
||||
</v-col>
|
||||
</v-row>
|
||||
<v-row v-if="selectedOriginal">
|
||||
<v-col cols="12">
|
||||
<div class="d-flex align-center">
|
||||
<v-avatar
|
||||
size="60"
|
||||
class="mr-3"
|
||||
>
|
||||
<v-img :src="selectedOriginal.imageUrl" />
|
||||
</v-avatar>
|
||||
<div>
|
||||
<div class="subtitle-1">
|
||||
{{ selectedOriginal.title }}
|
||||
</div>
|
||||
</div>
|
||||
<v-spacer />
|
||||
<v-btn
|
||||
small
|
||||
text
|
||||
@click="clearSelectedOriginal"
|
||||
>
|
||||
해제
|
||||
</v-btn>
|
||||
</div>
|
||||
<v-col
|
||||
cols="12"
|
||||
md="6"
|
||||
>
|
||||
<v-text-field
|
||||
v-model="character.originalLink"
|
||||
label="원작링크"
|
||||
outlined
|
||||
dense
|
||||
/>
|
||||
</v-col>
|
||||
</v-row>
|
||||
|
||||
@@ -1053,7 +998,6 @@
|
||||
|
||||
<script>
|
||||
import {getCharacter, createCharacter, updateCharacter} from '@/api/character';
|
||||
import { searchOriginals } from '@/api/original';
|
||||
|
||||
export default {
|
||||
name: "CharacterForm",
|
||||
@@ -1091,13 +1035,6 @@ export default {
|
||||
personalities: [],
|
||||
backgrounds: [],
|
||||
originalCharacter: null, // 원본 캐릭터 데이터 저장용
|
||||
// 원작 선택 상태
|
||||
selectedOriginalId: null,
|
||||
selectedOriginal: null,
|
||||
originalOptions: [],
|
||||
originalSearchTerm: '',
|
||||
originalLoading: false,
|
||||
originalDebounce: null,
|
||||
character: {
|
||||
id: null,
|
||||
name: '',
|
||||
@@ -1109,7 +1046,6 @@ export default {
|
||||
age: '',
|
||||
mbti: '',
|
||||
characterType: '',
|
||||
originalWorkId: null,
|
||||
originalTitle: '',
|
||||
originalLink: '',
|
||||
speechPattern: '',
|
||||
@@ -1209,14 +1145,6 @@ export default {
|
||||
this.previewImage = null;
|
||||
}
|
||||
}
|
||||
},
|
||||
originalSearchTerm(val) {
|
||||
if (this.originalDebounce) clearTimeout(this.originalDebounce);
|
||||
if (!val || !val.trim()) {
|
||||
this.originalOptions = [];
|
||||
return;
|
||||
}
|
||||
this.originalDebounce = setTimeout(this.searchOriginalWorks, 300);
|
||||
}
|
||||
},
|
||||
|
||||
@@ -1237,55 +1165,6 @@ export default {
|
||||
this.$dialog.notify.success(message);
|
||||
},
|
||||
|
||||
async searchOriginalWorks() {
|
||||
try {
|
||||
this.originalLoading = true;
|
||||
const term = (this.originalSearchTerm || '').trim();
|
||||
if (!term) {
|
||||
this.originalOptions = [];
|
||||
return;
|
||||
}
|
||||
const res = await searchOriginals(term);
|
||||
if (res && res.status === 200 && res.data && res.data.success === true) {
|
||||
const data = res.data.data;
|
||||
const items = (data && data.content) ? data.content : (Array.isArray(data) ? data : []);
|
||||
this.originalOptions = items || [];
|
||||
} else {
|
||||
this.originalOptions = [];
|
||||
}
|
||||
} catch (e) {
|
||||
this.originalOptions = [];
|
||||
} finally {
|
||||
this.originalLoading = false;
|
||||
}
|
||||
},
|
||||
|
||||
onOriginalChange(val) {
|
||||
if (!val) {
|
||||
this.selectedOriginal = null;
|
||||
this.selectedOriginalId = null;
|
||||
this.character.originalWorkId = null;
|
||||
return;
|
||||
}
|
||||
const id = Number(val);
|
||||
const found = (this.originalOptions || []).find(o => Number(o.id) === id);
|
||||
if (found) {
|
||||
this.selectedOriginal = { id: Number(found.id), title: found.title, imageUrl: found.imageUrl };
|
||||
} else if (this.selectedOriginal && Number(this.selectedOriginal.id) === id) {
|
||||
// keep current selectedOriginal
|
||||
} else {
|
||||
this.selectedOriginal = { id };
|
||||
}
|
||||
this.selectedOriginalId = id;
|
||||
this.character.originalWorkId = id;
|
||||
},
|
||||
|
||||
clearSelectedOriginal() {
|
||||
this.selectedOriginal = null;
|
||||
this.selectedOriginalId = null;
|
||||
this.character.originalWorkId = null;
|
||||
},
|
||||
|
||||
goBack() {
|
||||
this.$router.push('/character');
|
||||
},
|
||||
@@ -1567,11 +1446,10 @@ export default {
|
||||
// 로드된 캐릭터 데이터에서 null을 빈 문자열로 변환 (UI 표시용)
|
||||
normalizeCharacterData(data) {
|
||||
const result = { ...data };
|
||||
// 기본값 보정
|
||||
if (result.originalWorkId == null) result.originalWorkId = null;
|
||||
const simpleFields = [
|
||||
'name', 'systemPrompt', 'description', 'age', 'gender', 'mbti',
|
||||
'characterType', 'speechPattern', 'speechStyle', 'appearance', 'imageUrl'
|
||||
'characterType', 'originalTitle', 'originalLink', 'speechPattern',
|
||||
'speechStyle', 'appearance', 'imageUrl'
|
||||
];
|
||||
simpleFields.forEach(f => {
|
||||
if (result[f] == null) result[f] = '';
|
||||
@@ -1591,7 +1469,8 @@ export default {
|
||||
gender: this.character.gender,
|
||||
mbti: this.character.mbti,
|
||||
characterType: this.character.characterType,
|
||||
originalWorkId: this.character.originalWorkId,
|
||||
originalTitle: this.character.originalTitle,
|
||||
originalLink: this.character.originalLink,
|
||||
speechPattern: this.character.speechPattern,
|
||||
speechStyle: this.character.speechStyle,
|
||||
appearance: this.character.appearance,
|
||||
@@ -1614,7 +1493,7 @@ export default {
|
||||
|
||||
// 기본 필드 비교
|
||||
const simpleFields = [
|
||||
'name', 'description', 'age', 'gender', 'mbti', 'characterType', 'originalWorkId',
|
||||
'name', 'description', 'age', 'gender', 'mbti', 'characterType', 'originalTitle', 'originalLink',
|
||||
'speechPattern', 'speechStyle', 'isActive'
|
||||
];
|
||||
|
||||
@@ -1664,15 +1543,6 @@ export default {
|
||||
}
|
||||
});
|
||||
|
||||
// 특수 규칙: 기존에 원작이 연결되어 있었고, 해제(선택 제거)한 경우 서버 규약에 따라 0으로 전송
|
||||
if (this.isEdit && ('originalWorkId' in changedFields)) {
|
||||
const prev = this.originalCharacter && this.originalCharacter.originalWorkId;
|
||||
const curr = changedFields.originalWorkId;
|
||||
if ((curr === null || curr === undefined || curr === '') && (prev !== null && prev !== undefined && Number(prev) > 0)) {
|
||||
changedFields.originalWorkId = 0;
|
||||
}
|
||||
}
|
||||
|
||||
return changedFields;
|
||||
},
|
||||
|
||||
@@ -1696,18 +1566,6 @@ export default {
|
||||
image: null // 파일 입력은 초기화
|
||||
};
|
||||
|
||||
// 원작 선택 UI 반영
|
||||
if (this.character.originalWork) {
|
||||
const d = this.character.originalWork;
|
||||
this.selectedOriginal = d ? { id: Number(d.id), title: d.title, imageUrl: d.imageUrl } : null;
|
||||
this.selectedOriginalId = d ? Number(d.id) : null;
|
||||
this.character.originalWorkId = d ? Number(d.id) : null;
|
||||
this.originalCharacter.originalWorkId = d ? Number(d.id) : null;
|
||||
} else {
|
||||
this.selectedOriginal = null;
|
||||
this.selectedOriginalId = null;
|
||||
}
|
||||
|
||||
// 태그, 메모리, 인물관계, 취미, 가치관, 목표, 성격 특성, 세계관 설정
|
||||
this.tags = data.tags || [];
|
||||
this.memories = data.memories || [];
|
||||
@@ -1750,11 +1608,6 @@ export default {
|
||||
this.character.personalities = [...this.personalities];
|
||||
this.character.backgrounds = [...this.backgrounds];
|
||||
|
||||
// 선택된 원작 기준으로 originalWorkId 최종 반영
|
||||
if (this.selectedOriginalId !== null) {
|
||||
this.character.originalWorkId = this.selectedOriginalId;
|
||||
}
|
||||
|
||||
let response;
|
||||
|
||||
if (this.isEdit) {
|
||||
@@ -1877,7 +1730,8 @@ export default {
|
||||
gender: str(data.gender),
|
||||
mbti: str(data.mbti),
|
||||
characterType: str(data.characterType),
|
||||
originalWorkId: data.originalWorkId == null ? null : Number(data.originalWorkId),
|
||||
originalTitle: str(data.originalTitle),
|
||||
originalLink: str(data.originalLink),
|
||||
speechPattern: str(data.speechPattern),
|
||||
speechStyle: str(data.speechStyle),
|
||||
appearance: str(data.appearance)
|
||||
|
||||
@@ -9,7 +9,7 @@
|
||||
<br>
|
||||
|
||||
<v-container>
|
||||
<v-row align="center">
|
||||
<v-row>
|
||||
<v-col cols="4">
|
||||
<v-btn
|
||||
color="primary"
|
||||
@@ -19,29 +19,6 @@
|
||||
캐릭터 추가
|
||||
</v-btn>
|
||||
</v-col>
|
||||
<v-col
|
||||
cols="8"
|
||||
class="d-flex justify-end align-center"
|
||||
>
|
||||
<v-text-field
|
||||
v-model="searchTerm"
|
||||
label="검색어"
|
||||
placeholder="캐릭터명, 태그, mbti 검색"
|
||||
outlined
|
||||
dense
|
||||
hide-details
|
||||
style="max-width: 320px;"
|
||||
class="mr-2"
|
||||
@keyup.enter="onSearch"
|
||||
/>
|
||||
<v-btn
|
||||
:style="{ backgroundColor: '#3bb9f1', color: 'white' }"
|
||||
:disabled="is_loading"
|
||||
@click="onSearch"
|
||||
>
|
||||
검색
|
||||
</v-btn>
|
||||
</v-col>
|
||||
</v-row>
|
||||
<v-row>
|
||||
<v-col>
|
||||
@@ -267,7 +244,7 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { getCharacterList, updateCharacter, searchCharacterList } from '@/api/character'
|
||||
import { getCharacterList, updateCharacter } from '@/api/character'
|
||||
|
||||
export default {
|
||||
name: "CharacterList",
|
||||
@@ -283,8 +260,7 @@ export default {
|
||||
page: 1,
|
||||
total_page: 0,
|
||||
characters: [],
|
||||
selected_character: {},
|
||||
searchTerm: ''
|
||||
selected_character: {}
|
||||
}
|
||||
},
|
||||
|
||||
@@ -393,18 +369,10 @@ export default {
|
||||
await this.getCharacters()
|
||||
},
|
||||
|
||||
onSearch() {
|
||||
this.page = 1;
|
||||
this.getCharacters();
|
||||
},
|
||||
|
||||
async getCharacters() {
|
||||
this.is_loading = true
|
||||
try {
|
||||
const hasSearch = this.searchTerm && this.searchTerm.trim() !== '';
|
||||
const response = hasSearch
|
||||
? await searchCharacterList(this.searchTerm.trim(), this.page, 20)
|
||||
: await getCharacterList(this.page);
|
||||
const response = await getCharacterList(this.page);
|
||||
|
||||
if (response && response.status === 200) {
|
||||
if (response.data.success === true) {
|
||||
|
||||
@@ -1,356 +0,0 @@
|
||||
<template>
|
||||
<div>
|
||||
<v-toolbar dark>
|
||||
<v-btn
|
||||
icon
|
||||
@click="goBack"
|
||||
>
|
||||
<v-icon>mdi-arrow-left</v-icon>
|
||||
</v-btn>
|
||||
<v-spacer />
|
||||
<v-toolbar-title>원작 상세</v-toolbar-title>
|
||||
<v-spacer />
|
||||
<v-btn
|
||||
color="primary"
|
||||
@click="openAssignDialog"
|
||||
>
|
||||
캐릭터 연결
|
||||
</v-btn>
|
||||
</v-toolbar>
|
||||
|
||||
<v-container>
|
||||
<v-card
|
||||
v-if="detail"
|
||||
class="pa-4"
|
||||
>
|
||||
<v-row>
|
||||
<v-col
|
||||
cols="12"
|
||||
md="4"
|
||||
>
|
||||
<v-img
|
||||
:src="detail.imageUrl"
|
||||
contain
|
||||
height="240"
|
||||
/>
|
||||
</v-col>
|
||||
<v-col
|
||||
cols="12"
|
||||
md="8"
|
||||
>
|
||||
<h2>{{ detail.title }}</h2>
|
||||
<div class="mt-2">
|
||||
콘텐츠 타입: {{ detail.contentType || '-' }}
|
||||
</div>
|
||||
<div>카테고리(장르): {{ detail.category || '-' }}</div>
|
||||
<div>19금 여부: {{ detail.isAdult ? '예' : '아니오' }}</div>
|
||||
<div>원천 원작: {{ detail.originalWork || '-' }}</div>
|
||||
<div class="mt-1">
|
||||
원천 원작 링크:
|
||||
<a
|
||||
v-if="detail.originalLink"
|
||||
:href="detail.originalLink"
|
||||
target="_blank"
|
||||
rel="noopener"
|
||||
>{{ detail.originalLink }}</a>
|
||||
<span v-else>-</span>
|
||||
</div>
|
||||
<div>글/그림: {{ detail.writer || '-' }}</div>
|
||||
<div>제작사: {{ detail.studio || '-' }}</div>
|
||||
<div class="mt-1">
|
||||
원작 링크:
|
||||
<template v-if="detail.originalLinks && detail.originalLinks.length">
|
||||
<div>
|
||||
<div
|
||||
v-for="(link, idx) in detail.originalLinks"
|
||||
:key="idx"
|
||||
>
|
||||
<a
|
||||
:href="link"
|
||||
target="_blank"
|
||||
rel="noopener"
|
||||
>{{ link }}</a>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<span v-else>-</span>
|
||||
</div>
|
||||
<div class="mt-1">
|
||||
태그:
|
||||
<template v-if="detail.tags && detail.tags.length">
|
||||
<v-chip
|
||||
v-for="(t, i) in detail.tags"
|
||||
:key="i"
|
||||
small
|
||||
class="mr-1 mb-1"
|
||||
>
|
||||
{{ t }}
|
||||
</v-chip>
|
||||
</template>
|
||||
<span v-else>-</span>
|
||||
</div>
|
||||
<div class="mt-2">
|
||||
작품 소개:
|
||||
</div>
|
||||
<div style="white-space:pre-wrap;">
|
||||
{{ detail.description || '-' }}
|
||||
</div>
|
||||
</v-col>
|
||||
</v-row>
|
||||
</v-card>
|
||||
|
||||
<v-card class="pa-4 mt-6">
|
||||
<div class="d-flex align-center mb-4">
|
||||
<h3>연결된 캐릭터</h3>
|
||||
<v-spacer />
|
||||
</div>
|
||||
<v-row>
|
||||
<v-col
|
||||
v-for="c in characters"
|
||||
:key="c.id"
|
||||
cols="12"
|
||||
sm="6"
|
||||
md="4"
|
||||
lg="3"
|
||||
>
|
||||
<v-card>
|
||||
<v-img
|
||||
:src="c.imagePath"
|
||||
height="180"
|
||||
contain
|
||||
/>
|
||||
<v-card-title class="text-no-wrap">
|
||||
{{ c.name }}
|
||||
</v-card-title>
|
||||
<v-card-actions>
|
||||
<v-spacer />
|
||||
<v-btn
|
||||
small
|
||||
color="error"
|
||||
@click="unassign([c.id])"
|
||||
>
|
||||
해제
|
||||
</v-btn>
|
||||
<v-spacer />
|
||||
</v-card-actions>
|
||||
</v-card>
|
||||
</v-col>
|
||||
</v-row>
|
||||
<v-row v-if="isLoadingCharacters">
|
||||
<v-col class="text-center">
|
||||
<v-progress-circular
|
||||
indeterminate
|
||||
color="primary"
|
||||
/>
|
||||
</v-col>
|
||||
</v-row>
|
||||
</v-card>
|
||||
</v-container>
|
||||
|
||||
<v-dialog
|
||||
v-model="assignDialog"
|
||||
max-width="800"
|
||||
>
|
||||
<v-card>
|
||||
<v-card-title>캐릭터 연결</v-card-title>
|
||||
<v-card-text>
|
||||
<v-text-field
|
||||
v-model="searchKeyword"
|
||||
label="캐릭터 검색"
|
||||
outlined
|
||||
dense
|
||||
@input="onSearchInput"
|
||||
/>
|
||||
<v-data-table
|
||||
v-model="selectedToAssign"
|
||||
:headers="headers"
|
||||
:items="searchResults"
|
||||
:loading="searchLoading"
|
||||
item-key="id"
|
||||
show-select
|
||||
:items-per-page="5"
|
||||
>
|
||||
<template v-slot:item.imageUrl="{ item }">
|
||||
<v-img
|
||||
:src="item.imagePath"
|
||||
max-width="60"
|
||||
max-height="60"
|
||||
class="rounded-circle"
|
||||
/>
|
||||
</template>
|
||||
</v-data-table>
|
||||
</v-card-text>
|
||||
<v-card-actions>
|
||||
<v-spacer />
|
||||
<v-btn
|
||||
text
|
||||
@click="assignDialog = false"
|
||||
>
|
||||
취소
|
||||
</v-btn>
|
||||
<v-btn
|
||||
color="primary"
|
||||
:disabled="selectedToAssign.length===0"
|
||||
@click="assign"
|
||||
>
|
||||
연결
|
||||
</v-btn>
|
||||
</v-card-actions>
|
||||
</v-card>
|
||||
</v-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { getOriginal, getOriginalCharacters, assignCharactersToOriginal, unassignCharactersFromOriginal } from '@/api/original'
|
||||
import { searchCharacters } from '@/api/character'
|
||||
|
||||
export default {
|
||||
name: 'OriginalDetail',
|
||||
data() {
|
||||
return {
|
||||
id: null,
|
||||
detail: null,
|
||||
characters: [],
|
||||
page: 1,
|
||||
hasMore: true,
|
||||
isLoadingCharacters: false,
|
||||
assignDialog: false,
|
||||
searchKeyword: '',
|
||||
searchLoading: false,
|
||||
searchResults: [],
|
||||
selectedToAssign: [],
|
||||
headers: [
|
||||
{ text: '이미지', value: 'imageUrl', sortable: false },
|
||||
{ text: '이름', value: 'name' },
|
||||
{ text: 'ID', value: 'id' }
|
||||
],
|
||||
debounceTimer: null
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.id = this.$route.query.id
|
||||
if (!this.id) {
|
||||
this.$dialog.notify.error('잘못된 접근입니다.');
|
||||
this.$router.push('/original-work');
|
||||
return;
|
||||
}
|
||||
this.loadDetail();
|
||||
this.loadCharacters();
|
||||
window.addEventListener('scroll', this.onScroll);
|
||||
},
|
||||
beforeDestroy() {
|
||||
window.removeEventListener('scroll', this.onScroll);
|
||||
},
|
||||
methods: {
|
||||
notifyError(message) { this.$dialog.notify.error(message) },
|
||||
notifySuccess(message) { this.$dialog.notify.success(message) },
|
||||
goBack() { this.$router.push('/original-work') },
|
||||
async loadDetail() {
|
||||
try {
|
||||
const res = await getOriginal(this.id);
|
||||
if (res.status === 200 && res.data.success === true) {
|
||||
this.detail = res.data.data;
|
||||
} else {
|
||||
this.notifyError('상세 조회 실패');
|
||||
}
|
||||
} catch (e) {
|
||||
this.notifyError('상세 조회 실패');
|
||||
}
|
||||
},
|
||||
async loadCharacters() {
|
||||
if (this.isLoadingCharacters || !this.hasMore) return;
|
||||
this.isLoadingCharacters = true;
|
||||
try {
|
||||
const res = await getOriginalCharacters(this.id, this.page);
|
||||
if (res.status === 200 && res.data.success === true) {
|
||||
const content = res.data.data?.content || [];
|
||||
this.characters = this.characters.concat(content);
|
||||
this.hasMore = content.length > 0;
|
||||
this.page++;
|
||||
} else {
|
||||
this.notifyError('캐릭터 목록 조회 실패');
|
||||
}
|
||||
} catch (e) {
|
||||
this.notifyError('캐릭터 목록 조회 실패');
|
||||
} finally {
|
||||
this.isLoadingCharacters = false;
|
||||
}
|
||||
},
|
||||
onScroll() {
|
||||
const scrollPosition = window.innerHeight + window.scrollY;
|
||||
const documentHeight = document.documentElement.offsetHeight;
|
||||
if (scrollPosition >= documentHeight - 200 && !this.isLoadingCharacters && this.hasMore) {
|
||||
this.loadCharacters();
|
||||
}
|
||||
},
|
||||
openAssignDialog() {
|
||||
this.assignDialog = true;
|
||||
this.searchKeyword = '';
|
||||
this.searchResults = [];
|
||||
this.selectedToAssign = [];
|
||||
},
|
||||
onSearchInput() {
|
||||
if (this.debounceTimer) clearTimeout(this.debounceTimer);
|
||||
this.debounceTimer = setTimeout(this.search, 300);
|
||||
},
|
||||
async search() {
|
||||
if (!this.searchKeyword || !this.searchKeyword.trim()) {
|
||||
this.searchResults = [];
|
||||
return;
|
||||
}
|
||||
this.searchLoading = true;
|
||||
try {
|
||||
const res = await searchCharacters(this.searchKeyword.trim(), 1, 20);
|
||||
if (res.status === 200 && res.data.success === true) {
|
||||
this.searchResults = res.data.data?.content || [];
|
||||
} else {
|
||||
this.notifyError('검색 실패');
|
||||
}
|
||||
} catch (e) {
|
||||
this.notifyError('검색 실패');
|
||||
} finally {
|
||||
this.searchLoading = false;
|
||||
}
|
||||
},
|
||||
async assign() {
|
||||
if (this.selectedToAssign.length === 0) return;
|
||||
try {
|
||||
const ids = this.selectedToAssign.map(x => x.id);
|
||||
const res = await assignCharactersToOriginal(this.id, ids);
|
||||
if (res.status === 200 && res.data.success === true) {
|
||||
this.notifySuccess('연결되었습니다.');
|
||||
this.assignDialog = false;
|
||||
// 목록 초기화 후 재조회
|
||||
this.characters = [];
|
||||
this.page = 1;
|
||||
this.hasMore = true;
|
||||
this.loadCharacters();
|
||||
} else {
|
||||
this.notifyError('연결 실패');
|
||||
}
|
||||
} catch (e) {
|
||||
this.notifyError('연결 실패');
|
||||
}
|
||||
},
|
||||
async unassign(ids) {
|
||||
if (!ids || ids.length === 0) return;
|
||||
try {
|
||||
const res = await unassignCharactersFromOriginal(this.id, ids);
|
||||
if (res.status === 200 && res.data.success === true) {
|
||||
this.notifySuccess('해제되었습니다.');
|
||||
this.characters = this.characters.filter(c => !ids.includes(c.id));
|
||||
} else {
|
||||
this.notifyError('해제 실패');
|
||||
}
|
||||
} catch (e) {
|
||||
this.notifyError('해제 실패');
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.text-no-wrap { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
|
||||
</style>
|
||||
@@ -1,505 +0,0 @@
|
||||
<template>
|
||||
<div>
|
||||
<v-toolbar dark>
|
||||
<v-btn
|
||||
icon
|
||||
@click="goBack"
|
||||
>
|
||||
<v-icon>mdi-arrow-left</v-icon>
|
||||
</v-btn>
|
||||
<v-spacer />
|
||||
<v-toolbar-title>{{ isEdit ? '원작 수정' : '원작 등록' }}</v-toolbar-title>
|
||||
<v-spacer />
|
||||
</v-toolbar>
|
||||
|
||||
<v-container>
|
||||
<v-card class="pa-4">
|
||||
<v-form
|
||||
ref="form"
|
||||
v-model="isFormValid"
|
||||
>
|
||||
<v-card-text>
|
||||
<v-row>
|
||||
<v-col
|
||||
cols="12"
|
||||
md="6"
|
||||
>
|
||||
<v-file-input
|
||||
v-model="form.image"
|
||||
label="이미지"
|
||||
accept="image/*"
|
||||
prepend-icon="mdi-camera"
|
||||
outlined
|
||||
dense
|
||||
:class="{ 'required-asterisk': !isEdit }"
|
||||
:rules="imageRules"
|
||||
/>
|
||||
</v-col>
|
||||
<v-col
|
||||
v-if="previewImage || form.imageUrl"
|
||||
cols="12"
|
||||
md="6"
|
||||
>
|
||||
<div class="text-center">
|
||||
<v-avatar size="150">
|
||||
<v-img
|
||||
:src="previewImage || form.imageUrl"
|
||||
contain
|
||||
/>
|
||||
</v-avatar>
|
||||
</div>
|
||||
</v-col>
|
||||
</v-row>
|
||||
|
||||
<v-row>
|
||||
<v-col cols="12">
|
||||
<v-text-field
|
||||
v-model="form.title"
|
||||
label="제목"
|
||||
outlined
|
||||
dense
|
||||
:rules="[v=>!!v||'제목은 필수입니다']"
|
||||
class="required-asterisk"
|
||||
/>
|
||||
</v-col>
|
||||
</v-row>
|
||||
|
||||
<v-row>
|
||||
<v-col
|
||||
cols="12"
|
||||
md="6"
|
||||
>
|
||||
<v-text-field
|
||||
v-model="form.contentType"
|
||||
label="콘텐츠 타입"
|
||||
outlined
|
||||
dense
|
||||
:rules="contentTypeRules"
|
||||
:class="{ 'required-asterisk': !isEdit }"
|
||||
/>
|
||||
</v-col>
|
||||
<v-col
|
||||
cols="12"
|
||||
md="6"
|
||||
>
|
||||
<v-text-field
|
||||
v-model="form.category"
|
||||
label="카테고리(장르)"
|
||||
outlined
|
||||
dense
|
||||
:rules="categoryRules"
|
||||
:class="{ 'required-asterisk': !isEdit }"
|
||||
/>
|
||||
</v-col>
|
||||
</v-row>
|
||||
|
||||
<!-- 추가 메타 정보 (요구 순서: 글/그림, 제작사, 원천원작, 원천 원작 링크) -->
|
||||
<v-row>
|
||||
<v-col
|
||||
cols="12"
|
||||
md="6"
|
||||
>
|
||||
<v-text-field
|
||||
v-model="form.writer"
|
||||
label="글/그림"
|
||||
outlined
|
||||
dense
|
||||
/>
|
||||
</v-col>
|
||||
<v-col
|
||||
cols="12"
|
||||
md="6"
|
||||
>
|
||||
<v-text-field
|
||||
v-model="form.studio"
|
||||
label="제작사"
|
||||
outlined
|
||||
dense
|
||||
/>
|
||||
</v-col>
|
||||
</v-row>
|
||||
|
||||
<v-row>
|
||||
<v-col
|
||||
cols="12"
|
||||
md="6"
|
||||
>
|
||||
<v-text-field
|
||||
v-model="form.originalWork"
|
||||
label="원천 원작"
|
||||
outlined
|
||||
dense
|
||||
/>
|
||||
</v-col>
|
||||
<v-col
|
||||
cols="12"
|
||||
md="6"
|
||||
>
|
||||
<v-text-field
|
||||
v-model="form.originalLink"
|
||||
label="원천 원작 링크"
|
||||
outlined
|
||||
dense
|
||||
:rules="originalLinkRules"
|
||||
:class="{ 'required-asterisk': !isEdit }"
|
||||
/>
|
||||
</v-col>
|
||||
</v-row>
|
||||
|
||||
<v-row>
|
||||
<v-col
|
||||
cols="12"
|
||||
md="12"
|
||||
>
|
||||
<v-switch
|
||||
v-model="form.isAdult"
|
||||
label="19금 여부"
|
||||
inset
|
||||
/>
|
||||
</v-col>
|
||||
</v-row>
|
||||
|
||||
<!-- 원작 링크(여러 개) 추가 -->
|
||||
<v-row>
|
||||
<v-col cols="12">
|
||||
<v-divider class="my-4" />
|
||||
<h3 class="mb-2">
|
||||
원작 링크
|
||||
</h3>
|
||||
<v-row>
|
||||
<v-col cols="11">
|
||||
<v-text-field
|
||||
v-model="newOriginalLink"
|
||||
label="원작 링크 추가"
|
||||
outlined
|
||||
dense
|
||||
@keyup.enter="addOriginalLink"
|
||||
/>
|
||||
</v-col>
|
||||
<v-col cols="1">
|
||||
<v-btn
|
||||
color="primary"
|
||||
class="mt-1"
|
||||
block
|
||||
:disabled="!newOriginalLink || !newOriginalLink.trim()"
|
||||
@click="addOriginalLink"
|
||||
>
|
||||
추가
|
||||
</v-btn>
|
||||
</v-col>
|
||||
</v-row>
|
||||
<v-card
|
||||
outlined
|
||||
class="mt-2"
|
||||
>
|
||||
<v-list v-if="form.originalLinks && form.originalLinks.length > 0">
|
||||
<v-list-item
|
||||
v-for="(link, idx) in form.originalLinks"
|
||||
:key="idx"
|
||||
>
|
||||
<v-list-item-content>
|
||||
<v-list-item-title class="text-truncate">
|
||||
{{ link }}
|
||||
</v-list-item-title>
|
||||
</v-list-item-content>
|
||||
<v-list-item-action>
|
||||
<v-btn
|
||||
small
|
||||
color="error"
|
||||
@click="removeOriginalLink(idx)"
|
||||
>
|
||||
삭제
|
||||
</v-btn>
|
||||
</v-list-item-action>
|
||||
</v-list-item>
|
||||
</v-list>
|
||||
<v-card-text
|
||||
v-else
|
||||
class="grey--text"
|
||||
>
|
||||
추가된 원작 링크가 없습니다.
|
||||
</v-card-text>
|
||||
</v-card>
|
||||
</v-col>
|
||||
</v-row>
|
||||
|
||||
<!-- 태그 -->
|
||||
<v-row>
|
||||
<v-col cols="12">
|
||||
<v-divider class="my-4" />
|
||||
<h3 class="mb-2">
|
||||
태그
|
||||
</h3>
|
||||
<v-combobox
|
||||
v-model="form.tags"
|
||||
multiple
|
||||
chips
|
||||
small-chips
|
||||
deletable-chips
|
||||
outlined
|
||||
dense
|
||||
label="태그를 입력 후 엔터로 추가"
|
||||
@keydown.space.prevent="onTagSpace"
|
||||
>
|
||||
<template v-slot:selection="{ attrs, item, select, selected }">
|
||||
<v-chip
|
||||
v-bind="attrs"
|
||||
:input-value="selected"
|
||||
close
|
||||
@click="select"
|
||||
@click:close="removeTag(item)"
|
||||
>
|
||||
{{ item }}
|
||||
</v-chip>
|
||||
</template>
|
||||
</v-combobox>
|
||||
</v-col>
|
||||
</v-row>
|
||||
|
||||
<v-row>
|
||||
<v-col cols="12">
|
||||
<v-textarea
|
||||
v-model="form.description"
|
||||
label="작품 소개"
|
||||
outlined
|
||||
rows="4"
|
||||
:rules="descriptionRules"
|
||||
:class="{ 'required-asterisk': !isEdit }"
|
||||
/>
|
||||
</v-col>
|
||||
</v-row>
|
||||
</v-card-text>
|
||||
|
||||
<v-card-actions>
|
||||
<v-spacer />
|
||||
<v-btn
|
||||
color="primary"
|
||||
:disabled="!canSubmit"
|
||||
@click="onSubmit"
|
||||
>
|
||||
{{ isEdit ? '수정' : '등록' }}
|
||||
</v-btn>
|
||||
</v-card-actions>
|
||||
</v-form>
|
||||
</v-card>
|
||||
</v-container>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { createOriginal, updateOriginal, getOriginal } from '@/api/original'
|
||||
|
||||
export default {
|
||||
name: 'OriginalForm',
|
||||
data() {
|
||||
return {
|
||||
isEdit: false,
|
||||
isFormValid: false,
|
||||
previewImage: null,
|
||||
newOriginalLink: '',
|
||||
form: {
|
||||
id: null,
|
||||
image: null,
|
||||
imageUrl: null,
|
||||
title: '',
|
||||
contentType: '',
|
||||
category: '',
|
||||
isAdult: false,
|
||||
description: '',
|
||||
originalLink: '', // 원천 원작 링크(파라미터명 유지)
|
||||
originalWork: '',
|
||||
writer: '',
|
||||
studio: '',
|
||||
originalLinks: [], // 추가 원작 링크들
|
||||
tags: []
|
||||
},
|
||||
originalInitial: null,
|
||||
imageRules: [v => (this.isEdit ? true : (!!v || '이미지를 선택하세요'))],
|
||||
contentTypeRules: [v => (this.isEdit ? true : (!!(v && v.toString().trim()) || '콘텐츠 타입은 필수입니다'))],
|
||||
categoryRules: [v => (this.isEdit ? true : (!!(v && v.toString().trim()) || '카테고리는 필수입니다'))],
|
||||
originalLinkRules: [v => (this.isEdit ? true : (!!(v && v.toString().trim()) || '원천 원작 링크는 필수입니다'))],
|
||||
descriptionRules: [v => (this.isEdit ? true : (!!(v && v.toString().trim()) || '작품 소개는 필수입니다'))]
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
imageChanged() {
|
||||
return !!this.form.image;
|
||||
},
|
||||
hasNonImageChanges() {
|
||||
if (!this.isEdit || !this.originalInitial) return false;
|
||||
const fields = ['title', 'contentType', 'category', 'isAdult', 'description', 'originalLink', 'originalWork', 'writer', 'studio'];
|
||||
const basicChanged = fields.some(f => this.form[f] !== this.originalInitial[f]);
|
||||
const arraysChanged = !this.arraysEqual(this.form.originalLinks, this.originalInitial.originalLinks)
|
||||
|| !this.arraysEqual(this.form.tags, this.originalInitial.tags);
|
||||
return basicChanged || arraysChanged;
|
||||
},
|
||||
hasEditChanges() {
|
||||
return this.imageChanged || this.hasNonImageChanges;
|
||||
},
|
||||
canSubmit() {
|
||||
if (this.isEdit) return this.hasEditChanges && !!(this.form.title && this.form.title.toString().trim());
|
||||
const required = [this.form.image, this.form.title, this.form.contentType, this.form.category, this.form.originalLink, this.form.description];
|
||||
return required.every(v => !!(v && (v.toString ? v.toString().trim() : v)));
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
'form.image': {
|
||||
handler(newImage) {
|
||||
if (newImage) {
|
||||
const reader = new FileReader();
|
||||
reader.onload = (e) => { this.previewImage = e.target.result }
|
||||
reader.readAsDataURL(newImage)
|
||||
} else {
|
||||
this.previewImage = null
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
if (this.$route.query.id) {
|
||||
this.isEdit = true;
|
||||
this.load(this.$route.query.id);
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
notifyError(message) { this.$dialog.notify.error(message) },
|
||||
notifySuccess(message) { this.$dialog.notify.success(message) },
|
||||
goBack() { this.$router.push('/original-work') },
|
||||
arraysEqual(a, b) {
|
||||
const arrA = Array.isArray(a) ? a : [];
|
||||
const arrB = Array.isArray(b) ? b : [];
|
||||
if (arrA.length !== arrB.length) return false;
|
||||
for (let i = 0; i < arrA.length; i++) {
|
||||
if (arrA[i] !== arrB[i]) return false;
|
||||
}
|
||||
return true;
|
||||
},
|
||||
addOriginalLink() {
|
||||
if (!this.newOriginalLink || !this.newOriginalLink.trim()) return;
|
||||
const val = this.newOriginalLink.trim();
|
||||
if (!this.form.originalLinks) this.form.originalLinks = [];
|
||||
if (!this.form.originalLinks.includes(val)) {
|
||||
this.form.originalLinks.push(val);
|
||||
}
|
||||
this.newOriginalLink = '';
|
||||
},
|
||||
removeOriginalLink(index) {
|
||||
if (!this.form.originalLinks) return;
|
||||
this.form.originalLinks.splice(index, 1);
|
||||
},
|
||||
onTagSpace() {
|
||||
// CharacterForm의 태그 방식과 유사: 마지막 항목을 공백 기준으로 확정
|
||||
if (!Array.isArray(this.form.tags)) this.form.tags = [];
|
||||
const last = this.form.tags[this.form.tags.length - 1];
|
||||
if (typeof last === 'string' && last.trim()) {
|
||||
let processed = last.trim().replace(/\s+/g, '');
|
||||
if (processed.length > 50) processed = processed.substring(0, 50);
|
||||
this.form.tags.splice(this.form.tags.length - 1, 1, processed);
|
||||
this.$nextTick(() => this.form.tags.push(''));
|
||||
}
|
||||
},
|
||||
removeTag(item) {
|
||||
if (!Array.isArray(this.form.tags)) return;
|
||||
const idx = this.form.tags.indexOf(item);
|
||||
if (idx >= 0) this.form.tags.splice(idx, 1);
|
||||
},
|
||||
async load(id) {
|
||||
try {
|
||||
const res = await getOriginal(id);
|
||||
if (res.status === 200 && res.data.success === true) {
|
||||
const d = res.data.data;
|
||||
this.form = {
|
||||
id: d.id,
|
||||
image: null,
|
||||
imageUrl: d.imageUrl,
|
||||
title: d.title || '',
|
||||
contentType: d.contentType || '',
|
||||
category: d.category || '',
|
||||
isAdult: !!d.isAdult,
|
||||
description: d.description || '',
|
||||
originalLink: d.originalLink || '',
|
||||
originalWork: d.originalWork || '',
|
||||
writer: d.writer || '',
|
||||
studio: d.studio || '',
|
||||
originalLinks: Array.isArray(d.originalLinks) ? d.originalLinks.slice() : [],
|
||||
tags: Array.isArray(d.tags) ? d.tags.slice() : []
|
||||
}
|
||||
this.originalInitial = {
|
||||
id: d.id,
|
||||
imageUrl: d.imageUrl,
|
||||
title: d.title || '',
|
||||
contentType: d.contentType || '',
|
||||
category: d.category || '',
|
||||
isAdult: !!d.isAdult,
|
||||
description: d.description || '',
|
||||
originalLink: d.originalLink || '',
|
||||
originalWork: d.originalWork || '',
|
||||
writer: d.writer || '',
|
||||
studio: d.studio || '',
|
||||
originalLinks: Array.isArray(d.originalLinks) ? d.originalLinks.slice() : [],
|
||||
tags: Array.isArray(d.tags) ? d.tags.slice() : []
|
||||
}
|
||||
} else {
|
||||
this.notifyError('상세 조회 실패');
|
||||
}
|
||||
} catch (e) {
|
||||
this.notifyError('상세 조회 실패');
|
||||
}
|
||||
},
|
||||
async onSubmit() {
|
||||
try {
|
||||
const isValid = this.$refs.form ? this.$refs.form.validate() : true;
|
||||
if (!isValid) {
|
||||
this.notifyError(this.isEdit ? '입력을 확인해주세요.' : '필수 항목을 모두 입력해주세요.');
|
||||
return;
|
||||
}
|
||||
|
||||
if (this.isEdit) {
|
||||
const fields = ['title', 'contentType', 'category', 'isAdult', 'description', 'originalLink', 'originalWork', 'writer', 'studio'];
|
||||
const patch = { id: this.form.id };
|
||||
if (this.originalInitial) {
|
||||
fields.forEach(f => {
|
||||
if (this.form[f] !== this.originalInitial[f]) {
|
||||
patch[f] = this.form[f];
|
||||
}
|
||||
});
|
||||
if (!this.arraysEqual(this.form.originalLinks, this.originalInitial.originalLinks)) {
|
||||
patch.originalLinks = this.form.originalLinks;
|
||||
}
|
||||
if (!this.arraysEqual(this.form.tags, this.originalInitial.tags)) {
|
||||
patch.tags = this.form.tags;
|
||||
}
|
||||
}
|
||||
const image = this.form.image || null;
|
||||
if (Object.keys(patch).length === 1 && !image) {
|
||||
this.notifyError('변경된 내용이 없습니다.');
|
||||
return;
|
||||
}
|
||||
|
||||
const res = await updateOriginal(patch, image);
|
||||
if (res.status === 200 && res.data.success === true) {
|
||||
this.notifySuccess('수정되었습니다.');
|
||||
this.$router.push('/original-work');
|
||||
} else {
|
||||
this.notifyError('수정 실패');
|
||||
}
|
||||
} else {
|
||||
const res = await createOriginal(this.form);
|
||||
if (res.status === 200 && res.data.success === true) {
|
||||
this.notifySuccess('등록되었습니다.');
|
||||
this.$router.push('/original-work');
|
||||
} else {
|
||||
this.notifyError('등록 실패');
|
||||
}
|
||||
}
|
||||
} catch (e) {
|
||||
this.notifyError(this.isEdit ? '수정 실패' : '등록 실패');
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.required-asterisk >>> .v-label::after { content: ' *'; color: #ff5252; }
|
||||
</style>
|
||||
@@ -1,205 +0,0 @@
|
||||
<template>
|
||||
<div>
|
||||
<v-toolbar dark>
|
||||
<v-spacer />
|
||||
<v-toolbar-title>원작 리스트</v-toolbar-title>
|
||||
<v-spacer />
|
||||
<v-btn
|
||||
color="primary"
|
||||
dark
|
||||
@click="goToCreate"
|
||||
>
|
||||
원작 등록
|
||||
</v-btn>
|
||||
</v-toolbar>
|
||||
|
||||
<v-container>
|
||||
<v-row v-if="isLoading && originals.length === 0">
|
||||
<v-col class="text-center">
|
||||
<v-progress-circular
|
||||
indeterminate
|
||||
color="primary"
|
||||
size="64"
|
||||
/>
|
||||
</v-col>
|
||||
</v-row>
|
||||
|
||||
<v-row>
|
||||
<v-col
|
||||
v-for="item in originals"
|
||||
:key="item.id"
|
||||
cols="12"
|
||||
sm="6"
|
||||
md="4"
|
||||
lg="3"
|
||||
>
|
||||
<v-card
|
||||
class="mx-auto"
|
||||
max-width="344"
|
||||
style="cursor:pointer;"
|
||||
@click="openDetail(item)"
|
||||
>
|
||||
<v-img
|
||||
:src="item.imageUrl"
|
||||
height="200"
|
||||
contain
|
||||
/>
|
||||
<v-card-title class="text-no-wrap">
|
||||
{{ item.title }}
|
||||
</v-card-title>
|
||||
<v-card-actions>
|
||||
<v-spacer />
|
||||
<v-btn
|
||||
small
|
||||
color="primary"
|
||||
@click.stop="editOriginal(item)"
|
||||
>
|
||||
수정
|
||||
</v-btn>
|
||||
<v-btn
|
||||
small
|
||||
color="error"
|
||||
@click.stop="confirmDelete(item)"
|
||||
>
|
||||
삭제
|
||||
</v-btn>
|
||||
<v-spacer />
|
||||
</v-card-actions>
|
||||
</v-card>
|
||||
</v-col>
|
||||
</v-row>
|
||||
|
||||
<v-row v-if="!isLoading && originals.length === 0">
|
||||
<v-col class="text-center">
|
||||
데이터가 없습니다.
|
||||
</v-col>
|
||||
</v-row>
|
||||
|
||||
<v-row v-if="isLoading && originals.length > 0">
|
||||
<v-col class="text-center">
|
||||
<v-progress-circular
|
||||
indeterminate
|
||||
color="primary"
|
||||
/>
|
||||
</v-col>
|
||||
</v-row>
|
||||
</v-container>
|
||||
|
||||
<v-dialog
|
||||
v-model="deleteDialog"
|
||||
max-width="400"
|
||||
>
|
||||
<v-card>
|
||||
<v-card-title class="headline">
|
||||
삭제 확인
|
||||
</v-card-title>
|
||||
<v-card-text>정말 삭제하시겠습니까?</v-card-text>
|
||||
<v-card-actions>
|
||||
<v-spacer />
|
||||
<v-btn
|
||||
text
|
||||
@click="deleteDialog = false"
|
||||
>
|
||||
취소
|
||||
</v-btn>
|
||||
<v-btn
|
||||
color="error"
|
||||
text
|
||||
@click="deleteItem"
|
||||
>
|
||||
삭제
|
||||
</v-btn>
|
||||
</v-card-actions>
|
||||
</v-card>
|
||||
</v-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { getOriginalList, deleteOriginal } from '@/api/original'
|
||||
|
||||
export default {
|
||||
name: 'OriginalList',
|
||||
data() {
|
||||
return {
|
||||
isLoading: false,
|
||||
originals: [],
|
||||
page: 1,
|
||||
hasMore: true,
|
||||
deleteDialog: false,
|
||||
selected: null
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.loadMore();
|
||||
window.addEventListener('scroll', this.handleScroll);
|
||||
},
|
||||
beforeDestroy() {
|
||||
window.removeEventListener('scroll', this.handleScroll);
|
||||
},
|
||||
methods: {
|
||||
notifyError(message) { this.$dialog.notify.error(message) },
|
||||
notifySuccess(message) { this.$dialog.notify.success(message) },
|
||||
async loadMore() {
|
||||
if (this.isLoading || !this.hasMore) return;
|
||||
this.isLoading = true;
|
||||
try {
|
||||
const res = await getOriginalList(this.page);
|
||||
if (res.status === 200 && res.data.success === true) {
|
||||
const content = res.data.data?.content || [];
|
||||
this.originals = this.originals.concat(content);
|
||||
this.hasMore = content.length > 0;
|
||||
this.page++;
|
||||
} else {
|
||||
this.notifyError('원작 목록 조회 실패');
|
||||
}
|
||||
} catch (e) {
|
||||
this.notifyError('원작 목록 조회 실패');
|
||||
} finally {
|
||||
this.isLoading = false;
|
||||
}
|
||||
},
|
||||
handleScroll() {
|
||||
const scrollPosition = window.innerHeight + window.scrollY;
|
||||
const documentHeight = document.documentElement.offsetHeight;
|
||||
if (scrollPosition >= documentHeight - 200 && !this.isLoading && this.hasMore) {
|
||||
this.loadMore();
|
||||
}
|
||||
},
|
||||
goToCreate() {
|
||||
this.$router.push('/original-work/form');
|
||||
},
|
||||
editOriginal(item) {
|
||||
this.$router.push({ path: '/original-work/form', query: { id: item.id } });
|
||||
},
|
||||
openDetail(item) {
|
||||
this.$router.push({ path: '/original-work/detail', query: { id: item.id } });
|
||||
},
|
||||
confirmDelete(item) {
|
||||
this.selected = item;
|
||||
this.deleteDialog = true;
|
||||
},
|
||||
async deleteItem() {
|
||||
if (!this.selected) return;
|
||||
try {
|
||||
const res = await deleteOriginal(this.selected.id);
|
||||
if (res.status === 200 && res.data.success === true) {
|
||||
this.notifySuccess('삭제되었습니다.');
|
||||
this.originals = this.originals.filter(x => x.id !== this.selected.id);
|
||||
} else {
|
||||
this.notifyError('삭제 실패');
|
||||
}
|
||||
} catch (e) {
|
||||
this.notifyError('삭제 실패');
|
||||
} finally {
|
||||
this.deleteDialog = false;
|
||||
this.selected = null;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.text-no-wrap { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
|
||||
</style>
|
||||
@@ -53,24 +53,6 @@
|
||||
<template v-slot:item.communitySettlementRatio="{ item }">
|
||||
{{ item.communitySettlementRatio }}%
|
||||
</template>
|
||||
<template v-slot:item.actions="{ item }">
|
||||
<v-btn
|
||||
small
|
||||
color="primary"
|
||||
text
|
||||
@click="openEdit(item)"
|
||||
>
|
||||
수정
|
||||
</v-btn>
|
||||
<v-btn
|
||||
small
|
||||
color="red"
|
||||
text
|
||||
@click="confirmDelete(item)"
|
||||
>
|
||||
삭제
|
||||
</v-btn>
|
||||
</template>
|
||||
</v-data-table>
|
||||
</v-col>
|
||||
</v-row>
|
||||
@@ -91,20 +73,13 @@
|
||||
persistent
|
||||
>
|
||||
<v-card>
|
||||
<v-card-title>{{ is_edit ? '크리에이터 정산비율 수정' : '크리에이터 정산비율' }}</v-card-title>
|
||||
<v-card-text v-show="!is_edit">
|
||||
<v-card-title>크리에이터 정산비율</v-card-title>
|
||||
<v-card-text>
|
||||
<v-text-field
|
||||
v-model="creator_settlement_ratio.creator_id"
|
||||
label="크리에이터 번호"
|
||||
/>
|
||||
</v-card-text>
|
||||
<v-card-text v-show="is_edit">
|
||||
<v-text-field
|
||||
v-model="creator_settlement_ratio.nickname"
|
||||
disabled
|
||||
label="크리에이터 닉네임"
|
||||
/>
|
||||
</v-card-text>
|
||||
<v-card-text>
|
||||
<v-text-field
|
||||
v-model="creator_settlement_ratio.subsidy"
|
||||
@@ -143,7 +118,7 @@
|
||||
text
|
||||
@click="validate"
|
||||
>
|
||||
{{ is_edit ? '수정하기' : '등록하기' }}
|
||||
등록하기
|
||||
</v-btn>
|
||||
</v-card-actions>
|
||||
</v-card>
|
||||
@@ -167,8 +142,6 @@ export default {
|
||||
items: [],
|
||||
creator_settlement_ratio: {},
|
||||
show_write_dialog: false,
|
||||
is_edit: false,
|
||||
editing_item_id: null,
|
||||
headers: [
|
||||
{
|
||||
text: '닉네임',
|
||||
@@ -200,12 +173,6 @@ export default {
|
||||
sortable: false,
|
||||
value: 'communitySettlementRatio',
|
||||
},
|
||||
{
|
||||
text: '관리',
|
||||
align: 'center',
|
||||
sortable: false,
|
||||
value: 'actions',
|
||||
},
|
||||
],
|
||||
}
|
||||
},
|
||||
@@ -224,16 +191,11 @@ export default {
|
||||
},
|
||||
|
||||
showWriteDialog() {
|
||||
this.is_edit = false
|
||||
this.editing_item_id = null
|
||||
this.creator_settlement_ratio = {}
|
||||
this.show_write_dialog = true
|
||||
},
|
||||
|
||||
cancel() {
|
||||
this.creator_settlement_ratio = {}
|
||||
this.is_edit = false
|
||||
this.editing_item_id = null
|
||||
this.show_write_dialog = false
|
||||
},
|
||||
|
||||
@@ -263,11 +225,7 @@ export default {
|
||||
return
|
||||
}
|
||||
|
||||
if (this.is_edit) {
|
||||
this.updateCreatorSettlementRatio();
|
||||
} else {
|
||||
this.createCreatorSettlementRatio();
|
||||
}
|
||||
this.createCreatorSettlementRatio();
|
||||
},
|
||||
|
||||
async createCreatorSettlementRatio() {
|
||||
@@ -295,71 +253,6 @@ export default {
|
||||
this.is_loading = false
|
||||
},
|
||||
|
||||
async updateCreatorSettlementRatio() {
|
||||
if (this.is_loading) return;
|
||||
this.is_loading = true
|
||||
try {
|
||||
// 수정은 생성과 동일한 파라미터를 전송 (memberId 기준)
|
||||
const payload = { ...this.creator_settlement_ratio }
|
||||
const res = await api.updateCreatorSettlementRatio(payload)
|
||||
if (res.status === 200 && res.data.success === true) {
|
||||
this.cancel()
|
||||
this.notifySuccess(res.data.message || '수정되었습니다.')
|
||||
this.items = []
|
||||
await this.getSettlementRatio()
|
||||
} else {
|
||||
this.notifyError(res.data.message || '알 수 없는 오류가 발생했습니다. 다시 시도해 주세요.')
|
||||
}
|
||||
} catch (e) {
|
||||
this.notifyError('알 수 없는 오류가 발생했습니다. 다시 시도해 주세요.')
|
||||
} finally {
|
||||
this.is_loading = false
|
||||
}
|
||||
},
|
||||
|
||||
openEdit(item) {
|
||||
this.is_edit = true
|
||||
this.editing_item_id = null
|
||||
this.creator_settlement_ratio = {
|
||||
creator_id: item.memberId,
|
||||
nickname: item.nickname,
|
||||
subsidy: item.subsidy,
|
||||
liveSettlementRatio: item.liveSettlementRatio,
|
||||
contentSettlementRatio: item.contentSettlementRatio,
|
||||
communitySettlementRatio: item.communitySettlementRatio,
|
||||
}
|
||||
this.show_write_dialog = true
|
||||
},
|
||||
|
||||
async confirmDelete(item) {
|
||||
try {
|
||||
const ok = await this.$dialog.confirm({ text: '삭제하시겠습니까?', title: '확인', actions: { false: '취소', true: '삭제' } })
|
||||
if (!ok) return
|
||||
} catch (e) {
|
||||
// 일부 구현체는 confirm이 boolean이 아닌 경우가 있음
|
||||
}
|
||||
this.deleteCreatorSettlementRatio(item)
|
||||
},
|
||||
|
||||
async deleteCreatorSettlementRatio(item) {
|
||||
if (this.is_loading) return;
|
||||
this.is_loading = true
|
||||
try {
|
||||
const memberId = item.memberId
|
||||
const res = await api.deleteCreatorSettlementRatio(memberId)
|
||||
if (res.status === 200 && res.data.success === true) {
|
||||
this.notifySuccess(res.data.message || '삭제되었습니다.')
|
||||
this.items = this.items.filter(x => (x.memberId) !== memberId)
|
||||
} else {
|
||||
this.notifyError(res.data.message || '알 수 없는 오류가 발생했습니다. 다시 시도해 주세요.')
|
||||
}
|
||||
} catch (e) {
|
||||
this.notifyError('알 수 없는 오류가 발생했습니다. 다시 시도해 주세요.')
|
||||
} finally {
|
||||
this.is_loading = false
|
||||
}
|
||||
},
|
||||
|
||||
async getSettlementRatio() {
|
||||
this.is_loading = true
|
||||
|
||||
@@ -386,6 +279,10 @@ export default {
|
||||
},
|
||||
|
||||
async next() {
|
||||
if (this.search_word.length < 2) {
|
||||
this.search_word = ''
|
||||
}
|
||||
|
||||
await this.getSettlementRatio()
|
||||
},
|
||||
},
|
||||
|
||||
@@ -1,529 +0,0 @@
|
||||
<template>
|
||||
<div>
|
||||
<v-toolbar dark>
|
||||
<v-btn
|
||||
icon
|
||||
@click="goBack"
|
||||
>
|
||||
<v-icon>mdi-arrow-left</v-icon>
|
||||
</v-btn>
|
||||
<v-spacer />
|
||||
<v-toolbar-title>시리즈 배너 관리</v-toolbar-title>
|
||||
<v-spacer />
|
||||
</v-toolbar>
|
||||
|
||||
<v-container>
|
||||
<v-row>
|
||||
<v-col cols="4">
|
||||
<v-btn
|
||||
color="primary"
|
||||
dark
|
||||
@click="showAddDialog"
|
||||
>
|
||||
배너 추가
|
||||
</v-btn>
|
||||
</v-col>
|
||||
<v-spacer />
|
||||
</v-row>
|
||||
|
||||
<!-- 로딩 표시 -->
|
||||
<v-row v-if="isLoading && banners.length === 0">
|
||||
<v-col class="text-center">
|
||||
<v-progress-circular
|
||||
indeterminate
|
||||
color="primary"
|
||||
size="64"
|
||||
/>
|
||||
</v-col>
|
||||
</v-row>
|
||||
|
||||
<!-- 배너 그리드 -->
|
||||
<v-row>
|
||||
<draggable
|
||||
v-model="banners"
|
||||
class="row"
|
||||
style="width: 100%"
|
||||
:options="{ animation: 150 }"
|
||||
@end="onDragEnd"
|
||||
>
|
||||
<v-col
|
||||
v-for="banner in banners"
|
||||
:key="banner.id"
|
||||
cols="12"
|
||||
sm="6"
|
||||
md="4"
|
||||
lg="3"
|
||||
class="banner-item"
|
||||
>
|
||||
<v-card
|
||||
class="mx-auto"
|
||||
max-width="300"
|
||||
>
|
||||
<v-img
|
||||
:src="banner.imagePath || banner.imageUrl"
|
||||
height="200"
|
||||
contain
|
||||
/>
|
||||
<v-card-text class="text-center">
|
||||
<div>{{ resolveSeriesTitle(banner) }}</div>
|
||||
</v-card-text>
|
||||
<v-card-actions>
|
||||
<v-spacer />
|
||||
<v-btn
|
||||
small
|
||||
color="primary"
|
||||
@click="showEditDialog(banner)"
|
||||
>
|
||||
수정
|
||||
</v-btn>
|
||||
<v-btn
|
||||
small
|
||||
color="error"
|
||||
@click="confirmDelete(banner)"
|
||||
>
|
||||
삭제
|
||||
</v-btn>
|
||||
<v-spacer />
|
||||
</v-card-actions>
|
||||
</v-card>
|
||||
</v-col>
|
||||
</draggable>
|
||||
</v-row>
|
||||
|
||||
<!-- 데이터가 없을 때 표시 -->
|
||||
<v-row v-if="!isLoading && banners.length === 0">
|
||||
<v-col class="text-center">
|
||||
<p>등록된 배너가 없습니다.</p>
|
||||
</v-col>
|
||||
</v-row>
|
||||
|
||||
<!-- 무한 스크롤 로딩 -->
|
||||
<v-row v-if="isLoading && banners.length > 0">
|
||||
<v-col class="text-center">
|
||||
<v-progress-circular
|
||||
indeterminate
|
||||
color="primary"
|
||||
/>
|
||||
</v-col>
|
||||
</v-row>
|
||||
</v-container>
|
||||
|
||||
<!-- 배너 추가/수정 다이얼로그 -->
|
||||
<v-dialog
|
||||
v-model="showDialog"
|
||||
max-width="600px"
|
||||
persistent
|
||||
>
|
||||
<v-card>
|
||||
<v-card-title>
|
||||
<span class="headline">{{ isEdit ? '배너 수정' : '배너 추가' }}</span>
|
||||
</v-card-title>
|
||||
<v-card-text>
|
||||
<v-container>
|
||||
<v-row>
|
||||
<v-col cols="12">
|
||||
<v-file-input
|
||||
v-model="bannerForm.image"
|
||||
label="배너 이미지"
|
||||
accept="image/*"
|
||||
prepend-icon="mdi-camera"
|
||||
show-size
|
||||
truncate-length="15"
|
||||
:rules="imageRules"
|
||||
outlined
|
||||
/>
|
||||
</v-col>
|
||||
</v-row>
|
||||
<v-row v-if="previewImage || (isEdit && bannerForm.imageUrl)">
|
||||
<v-col
|
||||
cols="12"
|
||||
class="text-center"
|
||||
>
|
||||
<v-img
|
||||
:src="previewImage || bannerForm.imageUrl"
|
||||
max-height="200"
|
||||
contain
|
||||
/>
|
||||
</v-col>
|
||||
</v-row>
|
||||
<v-row>
|
||||
<v-col cols="12">
|
||||
<v-text-field
|
||||
v-model="searchKeyword"
|
||||
label="시리즈 검색"
|
||||
outlined
|
||||
@keyup.enter="searchSeries"
|
||||
/>
|
||||
</v-col>
|
||||
</v-row>
|
||||
<v-row v-if="searchResults.length > 0">
|
||||
<v-col cols="12">
|
||||
<v-list>
|
||||
<v-list-item
|
||||
v-for="series in searchResults"
|
||||
:key="series.id"
|
||||
@click="selectSeries(series)"
|
||||
>
|
||||
<v-list-item-avatar>
|
||||
<v-img :src="series.imageUrl" />
|
||||
</v-list-item-avatar>
|
||||
<v-list-item-content>
|
||||
<v-list-item-title>{{ series.title || series.name }}</v-list-item-title>
|
||||
</v-list-item-content>
|
||||
</v-list-item>
|
||||
</v-list>
|
||||
</v-col>
|
||||
</v-row>
|
||||
<v-row v-if="searchPerformed && searchResults.length === 0">
|
||||
<v-col cols="12">
|
||||
<v-alert
|
||||
type="info"
|
||||
outlined
|
||||
>
|
||||
검색결과가 없습니다.
|
||||
</v-alert>
|
||||
</v-col>
|
||||
</v-row>
|
||||
<v-row v-if="selectedSeries">
|
||||
<v-col cols="12">
|
||||
<v-alert
|
||||
type="info"
|
||||
outlined
|
||||
>
|
||||
<v-row align="center">
|
||||
<v-col cols="auto">
|
||||
<v-avatar size="50">
|
||||
<v-img :src="selectedSeries.imageUrl" />
|
||||
</v-avatar>
|
||||
</v-col>
|
||||
<v-col>
|
||||
<div class="font-weight-medium">
|
||||
선택된 시리즈: {{ selectedSeries.title || selectedSeries.name }}
|
||||
</div>
|
||||
</v-col>
|
||||
</v-row>
|
||||
</v-alert>
|
||||
</v-col>
|
||||
</v-row>
|
||||
</v-container>
|
||||
</v-card-text>
|
||||
<v-card-actions>
|
||||
<v-spacer />
|
||||
<v-btn
|
||||
color="blue darken-1"
|
||||
text
|
||||
@click="closeDialog"
|
||||
>
|
||||
취소
|
||||
</v-btn>
|
||||
<v-btn
|
||||
color="blue darken-1"
|
||||
text
|
||||
:disabled="!isFormValid || isSubmitting"
|
||||
@click="saveBanner"
|
||||
>
|
||||
{{ isSubmitting ? '저장중...' : (isEdit ? '수정' : '추가') }}
|
||||
</v-btn>
|
||||
</v-card-actions>
|
||||
</v-card>
|
||||
</v-dialog>
|
||||
|
||||
<!-- 삭제 확인 다이얼로그 -->
|
||||
<v-dialog
|
||||
v-model="showDeleteDialog"
|
||||
max-width="400px"
|
||||
>
|
||||
<v-card>
|
||||
<v-card-title class="headline">
|
||||
삭제 확인
|
||||
</v-card-title>
|
||||
<v-card-text>
|
||||
이 배너를 삭제하시겠습니까?
|
||||
</v-card-text>
|
||||
<v-card-actions>
|
||||
<v-spacer />
|
||||
<v-btn
|
||||
color="blue darken-1"
|
||||
text
|
||||
@click="showDeleteDialog = false"
|
||||
>
|
||||
취소
|
||||
</v-btn>
|
||||
<v-btn
|
||||
color="red darken-1"
|
||||
text
|
||||
:disabled="isSubmitting"
|
||||
@click="deleteBanner"
|
||||
>
|
||||
삭제
|
||||
</v-btn>
|
||||
</v-card-actions>
|
||||
</v-card>
|
||||
</v-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import draggable from 'vuedraggable'
|
||||
import {
|
||||
getSeriesBannerList,
|
||||
createSeriesBanner,
|
||||
updateSeriesBanner,
|
||||
deleteSeriesBanner,
|
||||
updateSeriesBannerOrder,
|
||||
searchSeriesList
|
||||
} from '@/api/audio_content_series'
|
||||
|
||||
export default {
|
||||
name: 'ContentSeriesBanner',
|
||||
components: { draggable },
|
||||
data() {
|
||||
return {
|
||||
isLoading: false,
|
||||
isSubmitting: false,
|
||||
banners: [],
|
||||
page: 1,
|
||||
hasMoreItems: true,
|
||||
showDialog: false,
|
||||
showDeleteDialog: false,
|
||||
isEdit: false,
|
||||
selectedBanner: null,
|
||||
selectedSeries: null,
|
||||
searchKeyword: '',
|
||||
searchResults: [],
|
||||
searchPerformed: false,
|
||||
previewImage: null,
|
||||
bannerForm: {
|
||||
image: null,
|
||||
imageUrl: '',
|
||||
seriesId: null,
|
||||
bannerId: null
|
||||
},
|
||||
imageRules: [
|
||||
v => !!v || this.isEdit || '이미지를 선택하세요'
|
||||
]
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
isFormValid() {
|
||||
return (this.bannerForm.image || (this.isEdit && this.bannerForm.imageUrl)) && this.selectedSeries
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
'bannerForm.image'(newImage) {
|
||||
if (newImage) {
|
||||
this.createImagePreview(newImage)
|
||||
} else {
|
||||
this.previewImage = null
|
||||
}
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.loadBanners()
|
||||
window.addEventListener('scroll', this.handleScroll)
|
||||
},
|
||||
beforeDestroy() {
|
||||
window.removeEventListener('scroll', this.handleScroll)
|
||||
},
|
||||
methods: {
|
||||
notifyError(message) {
|
||||
this.$dialog && this.$dialog.notify && this.$dialog.notify.error ? this.$dialog.notify.error(message) : console.error(message)
|
||||
},
|
||||
notifySuccess(message) {
|
||||
this.$dialog && this.$dialog.notify && this.$dialog.notify.success ? this.$dialog.notify.success(message) : console.log(message)
|
||||
},
|
||||
goBack() {
|
||||
this.$router.push('/content/series/list')
|
||||
},
|
||||
resolveSeriesTitle(banner) {
|
||||
return banner.seriesTitle || banner.seriesName || banner.title || banner.name || '시리즈'
|
||||
},
|
||||
async loadBanners() {
|
||||
if (this.isLoading || !this.hasMoreItems) return
|
||||
this.isLoading = true
|
||||
try {
|
||||
const response = await getSeriesBannerList(this.page)
|
||||
if (response && response.status === 200 && response.data && response.data.success === true) {
|
||||
const data = response.data.data
|
||||
const newBanners = (data && (data.content || data.items || data)) || []
|
||||
this.banners = [...this.banners, ...newBanners]
|
||||
this.hasMoreItems = newBanners.length > 0
|
||||
this.page++
|
||||
} else {
|
||||
this.notifyError('배너 목록을 불러오는데 실패했습니다.')
|
||||
}
|
||||
} catch (e) {
|
||||
this.notifyError('배너 목록을 불러오는데 실패했습니다.')
|
||||
} finally {
|
||||
this.isLoading = false
|
||||
}
|
||||
},
|
||||
handleScroll() {
|
||||
const scrollPosition = window.innerHeight + window.scrollY
|
||||
const documentHeight = document.documentElement.offsetHeight
|
||||
if (scrollPosition >= documentHeight - 200 && !this.isLoading && this.hasMoreItems) {
|
||||
this.loadBanners()
|
||||
}
|
||||
},
|
||||
showAddDialog() {
|
||||
this.isEdit = false
|
||||
this.selectedSeries = null
|
||||
this.bannerForm = { image: null, imageUrl: '', seriesId: null, bannerId: null }
|
||||
this.previewImage = null
|
||||
this.searchKeyword = ''
|
||||
this.searchResults = []
|
||||
this.searchPerformed = false
|
||||
this.showDialog = true
|
||||
},
|
||||
showEditDialog(banner) {
|
||||
this.isEdit = true
|
||||
this.selectedBanner = banner
|
||||
this.selectedSeries = {
|
||||
id: banner.seriesId,
|
||||
title: banner.seriesTitle || banner.seriesName || banner.title || banner.name,
|
||||
imageUrl: banner.seriesImageUrl
|
||||
}
|
||||
this.bannerForm = {
|
||||
image: null,
|
||||
imageUrl: banner.imageUrl || banner.imagePath,
|
||||
seriesId: banner.seriesId,
|
||||
bannerId: banner.id
|
||||
}
|
||||
this.previewImage = null
|
||||
this.searchKeyword = ''
|
||||
this.searchResults = []
|
||||
this.searchPerformed = false
|
||||
this.showDialog = true
|
||||
},
|
||||
closeDialog() {
|
||||
this.showDialog = false
|
||||
this.selectedSeries = null
|
||||
this.bannerForm = { image: null, imageUrl: '', seriesId: null, bannerId: null }
|
||||
this.previewImage = null
|
||||
this.searchKeyword = ''
|
||||
this.searchResults = []
|
||||
this.searchPerformed = false
|
||||
},
|
||||
confirmDelete(banner) {
|
||||
this.selectedBanner = banner
|
||||
this.showDeleteDialog = true
|
||||
},
|
||||
createImagePreview(file) {
|
||||
if (!file) return
|
||||
const reader = new FileReader()
|
||||
reader.onload = (e) => {
|
||||
this.previewImage = e.target.result
|
||||
}
|
||||
reader.readAsDataURL(file)
|
||||
},
|
||||
async searchSeries() {
|
||||
if (!this.searchKeyword || this.searchKeyword.length < 2) {
|
||||
this.notifyError('검색어를 2글자 이상 입력하세요.')
|
||||
return
|
||||
}
|
||||
try {
|
||||
const response = await searchSeriesList(this.searchKeyword)
|
||||
if (response && response.status === 200 && response.data && response.data.success === true) {
|
||||
const data = response.data.data
|
||||
this.searchResults = Array.isArray(data) ? data : (data && (data.content || data.items)) || []
|
||||
this.searchPerformed = true
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('시리즈 검색 오류:', error)
|
||||
this.notifyError('시리즈 검색에 실패했습니다.')
|
||||
}
|
||||
},
|
||||
selectSeries(series) {
|
||||
this.selectedSeries = series
|
||||
this.bannerForm.seriesId = series.id
|
||||
this.searchResults = []
|
||||
},
|
||||
async saveBanner() {
|
||||
if (!this.isFormValid || this.isSubmitting) return
|
||||
this.isSubmitting = true
|
||||
try {
|
||||
if (this.isEdit) {
|
||||
const response = await updateSeriesBanner({
|
||||
image: this.bannerForm.image,
|
||||
seriesId: this.selectedSeries.id,
|
||||
bannerId: this.bannerForm.bannerId
|
||||
})
|
||||
if (response && response.status === 200 && response.data && response.data.success === true) {
|
||||
this.notifySuccess('배너가 수정되었습니다.')
|
||||
} else {
|
||||
this.notifyError('배너 수정을 실패했습니다.')
|
||||
}
|
||||
} else {
|
||||
const response = await createSeriesBanner({
|
||||
image: this.bannerForm.image,
|
||||
seriesId: this.selectedSeries.id
|
||||
})
|
||||
if (response && response.status === 200 && response.data && response.data.success === true) {
|
||||
this.notifySuccess('배너가 추가되었습니다.')
|
||||
this.closeDialog()
|
||||
this.refreshBanners()
|
||||
} else {
|
||||
this.notifyError('배너 추가를 실패했습니다.')
|
||||
}
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('배너 저장 오류:', error)
|
||||
this.notifyError('배너 저장에 실패했습니다.')
|
||||
} finally {
|
||||
this.isSubmitting = false
|
||||
}
|
||||
},
|
||||
async deleteBanner() {
|
||||
if (!this.selectedBanner || this.isSubmitting) return
|
||||
this.isSubmitting = true
|
||||
try {
|
||||
const response = await deleteSeriesBanner(this.selectedBanner.id)
|
||||
if (response && response.status === 200 && response.data && response.data.success === true) {
|
||||
this.notifySuccess('배너가 삭제되었습니다.')
|
||||
this.showDeleteDialog = false
|
||||
this.refreshBanners()
|
||||
} else {
|
||||
this.notifyError('배너 삭제에 실패했습니다.')
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('배너 삭제 오류:', error)
|
||||
this.notifyError('배너 삭제에 실패했습니다.')
|
||||
} finally {
|
||||
this.isSubmitting = false
|
||||
}
|
||||
},
|
||||
refreshBanners() {
|
||||
this.banners = []
|
||||
this.page = 1
|
||||
this.hasMoreItems = true
|
||||
this.loadBanners()
|
||||
},
|
||||
async onDragEnd() {
|
||||
try {
|
||||
const bannerIds = this.banners.map(banner => banner.id)
|
||||
const response = await updateSeriesBannerOrder(bannerIds)
|
||||
if (response && response.status === 200 && response.data && response.data.success === true) {
|
||||
this.notifySuccess('배너 순서가 변경되었습니다.')
|
||||
} else {
|
||||
this.notifyError('배너 순서 변경에 실패했습니다.')
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('배너 순서 변경 오류:', error)
|
||||
this.notifyError('배너 순서 변경에 실패했습니다.')
|
||||
this.refreshBanners()
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.banner-item {
|
||||
transition: all 0.3s;
|
||||
}
|
||||
|
||||
.banner-item:hover {
|
||||
transform: translateY(-5px);
|
||||
box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
</style>
|
||||
@@ -44,15 +44,9 @@
|
||||
<th class="text-center">
|
||||
연재여부
|
||||
</th>
|
||||
<th class="text-center">
|
||||
연재요일
|
||||
</th>
|
||||
<th class="text-center">
|
||||
19금
|
||||
</th>
|
||||
<th class="text-center">
|
||||
수정
|
||||
</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
@@ -79,20 +73,19 @@
|
||||
<td>
|
||||
<vue-show-more-text
|
||||
:text="item.title"
|
||||
:lines="2"
|
||||
:lines="3"
|
||||
/>
|
||||
</td>
|
||||
<td style="max-width: 200px !important; word-break:break-all; height: auto;">
|
||||
<vue-show-more-text
|
||||
:text="item.introduction"
|
||||
:lines="2"
|
||||
:lines="3"
|
||||
/>
|
||||
</td>
|
||||
<td>{{ item.creatorNickname }}</td>
|
||||
<td>{{ item.genre }}</td>
|
||||
<td>{{ item.numberOfWorks }}</td>
|
||||
<td>{{ item.state }}</td>
|
||||
<td>{{ formatPublishedDays(item.publishedDaysOfWeek) }}</td>
|
||||
<td>
|
||||
<div v-if="item.isAdult">
|
||||
O
|
||||
@@ -101,17 +94,6 @@
|
||||
X
|
||||
</div>
|
||||
</td>
|
||||
<td class="text-center">
|
||||
<v-btn
|
||||
small
|
||||
color="#3bb9f1"
|
||||
dark
|
||||
depressed
|
||||
@click="openEditDialog(item)"
|
||||
>
|
||||
수정
|
||||
</v-btn>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</template>
|
||||
@@ -129,165 +111,6 @@
|
||||
</v-col>
|
||||
</v-row>
|
||||
</v-container>
|
||||
|
||||
<v-dialog
|
||||
v-model="show_edit_dialog"
|
||||
max-width="700px"
|
||||
persistent
|
||||
>
|
||||
<v-card>
|
||||
<v-card-title>
|
||||
시리즈 수정
|
||||
</v-card-title>
|
||||
<v-card-text>
|
||||
<v-row>
|
||||
<v-col
|
||||
cols="3"
|
||||
class="text-center"
|
||||
>
|
||||
<v-img
|
||||
:src="edit_target.coverImageUrl"
|
||||
max-width="120"
|
||||
max-height="120"
|
||||
class="rounded-circle"
|
||||
/>
|
||||
</v-col>
|
||||
<v-col cols="9">
|
||||
<div style="font-weight:600;">
|
||||
{{ edit_target.title }}
|
||||
</div>
|
||||
<div
|
||||
v-if="edit_target.introduction"
|
||||
style="max-height:80px; overflow:auto; word-break:break-all;"
|
||||
>
|
||||
{{ edit_target.introduction }}
|
||||
</div>
|
||||
</v-col>
|
||||
</v-row>
|
||||
<v-divider class="my-4" />
|
||||
<v-row align="center">
|
||||
<v-col
|
||||
cols="4"
|
||||
class="d-flex align-center"
|
||||
>
|
||||
장르
|
||||
</v-col>
|
||||
<v-col
|
||||
cols="8"
|
||||
class="d-flex align-center"
|
||||
>
|
||||
<v-select
|
||||
v-model="edit_form.genreId"
|
||||
:items="genre_list"
|
||||
item-text="genre"
|
||||
item-value="id"
|
||||
:loading="is_loading_genres"
|
||||
:disabled="is_saving || is_loading_genres"
|
||||
label="장르를 선택하세요"
|
||||
dense
|
||||
hide-details
|
||||
/>
|
||||
</v-col>
|
||||
</v-row>
|
||||
<v-row align="center">
|
||||
<v-col
|
||||
cols="4"
|
||||
class="d-flex align-center"
|
||||
>
|
||||
연재 요일
|
||||
</v-col>
|
||||
<v-col
|
||||
cols="8"
|
||||
class="d-flex align-center"
|
||||
>
|
||||
<v-row
|
||||
dense
|
||||
class="flex-grow-1"
|
||||
>
|
||||
<v-col
|
||||
v-for="opt in daysOfWeekOptions"
|
||||
:key="opt.value"
|
||||
cols="6"
|
||||
sm="4"
|
||||
md="3"
|
||||
class="py-0 my-0"
|
||||
>
|
||||
<v-checkbox
|
||||
v-model="edit_form.publishedDaysOfWeek"
|
||||
:label="opt.text"
|
||||
:value="opt.value"
|
||||
:disabled="is_saving"
|
||||
dense
|
||||
hide-details
|
||||
class="ma-0 pa-0"
|
||||
/>
|
||||
</v-col>
|
||||
</v-row>
|
||||
</v-col>
|
||||
</v-row>
|
||||
<v-row align="center">
|
||||
<v-col
|
||||
cols="4"
|
||||
class="d-flex align-center"
|
||||
>
|
||||
오리지널
|
||||
</v-col>
|
||||
<v-col
|
||||
cols="8"
|
||||
class="d-flex align-center"
|
||||
>
|
||||
<v-checkbox
|
||||
v-model="edit_form.isOriginal"
|
||||
:disabled="is_saving"
|
||||
dense
|
||||
hide-details
|
||||
class="ma-0 pa-0"
|
||||
/>
|
||||
</v-col>
|
||||
</v-row>
|
||||
<v-row align="center">
|
||||
<v-col
|
||||
cols="4"
|
||||
class="d-flex align-center"
|
||||
>
|
||||
19금
|
||||
</v-col>
|
||||
<v-col
|
||||
cols="8"
|
||||
class="d-flex align-center"
|
||||
>
|
||||
<v-checkbox
|
||||
v-model="edit_form.isAdult"
|
||||
:disabled="is_saving"
|
||||
dense
|
||||
hide-details
|
||||
class="ma-0 pa-0"
|
||||
/>
|
||||
</v-col>
|
||||
</v-row>
|
||||
</v-card-text>
|
||||
<v-card-actions>
|
||||
<v-spacer />
|
||||
<v-btn
|
||||
text
|
||||
:disabled="is_saving"
|
||||
@click="cancelEdit"
|
||||
>
|
||||
취소
|
||||
</v-btn>
|
||||
<v-btn
|
||||
color="#3bb9f1"
|
||||
dark
|
||||
depressed
|
||||
:loading="is_saving"
|
||||
:disabled="is_saving"
|
||||
@click="saveEdit"
|
||||
>
|
||||
저장
|
||||
</v-btn>
|
||||
</v-card-actions>
|
||||
</v-card>
|
||||
</v-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@@ -307,52 +130,7 @@ export default {
|
||||
page: 1,
|
||||
total_page: 0,
|
||||
total_count: 0,
|
||||
series_list: [],
|
||||
// 수정 다이얼로그 상태/데이터
|
||||
show_edit_dialog: false,
|
||||
is_saving: false,
|
||||
is_loading_genres: false,
|
||||
genre_list: [],
|
||||
edit_target: {},
|
||||
edit_form: {
|
||||
genreId: null,
|
||||
isOriginal: false,
|
||||
isAdult: false,
|
||||
publishedDaysOfWeek: []
|
||||
},
|
||||
daysOfWeekOptions: [
|
||||
{ value: 'RANDOM', text: '랜덤' },
|
||||
{ value: 'SUN', text: '일' },
|
||||
{ value: 'MON', text: '월' },
|
||||
{ value: 'TUE', text: '화' },
|
||||
{ value: 'WED', text: '수' },
|
||||
{ value: 'THU', text: '목' },
|
||||
{ value: 'FRI', text: '금' },
|
||||
{ value: 'SAT', text: '토' }
|
||||
]
|
||||
}
|
||||
},
|
||||
|
||||
watch: {
|
||||
'edit_form.publishedDaysOfWeek': {
|
||||
handler(newVal, oldVal) {
|
||||
if (!Array.isArray(newVal)) return;
|
||||
const hasRandom = newVal.includes('RANDOM');
|
||||
const hadRandom = Array.isArray(oldVal) && oldVal.includes('RANDOM');
|
||||
const others = newVal.filter(v => v !== 'RANDOM');
|
||||
|
||||
// RANDOM과 특정 요일은 함께 설정될 수 없음
|
||||
if (hasRandom && others.length > 0) {
|
||||
if (hadRandom) {
|
||||
// RANDOM 상태에서 다른 요일을 선택한 경우 → RANDOM 제거, 나머지만 유지
|
||||
this.edit_form.publishedDaysOfWeek = others;
|
||||
} else {
|
||||
// 다른 요일이 선택된 상태에서 RANDOM을 선택한 경우 → RANDOM만 유지
|
||||
this.edit_form.publishedDaysOfWeek = ['RANDOM'];
|
||||
}
|
||||
}
|
||||
},
|
||||
deep: true
|
||||
series_list: []
|
||||
}
|
||||
},
|
||||
|
||||
@@ -369,19 +147,6 @@ export default {
|
||||
this.$dialog.notify.success(message)
|
||||
},
|
||||
|
||||
// 연재 요일 표시용 포맷터
|
||||
formatPublishedDays(days) {
|
||||
if (!Array.isArray(days) || days.length === 0) return '-'
|
||||
// RANDOM 우선 처리
|
||||
if (days.includes('RANDOM')) return '랜덤'
|
||||
const map = this.daysOfWeekOptions.reduce((acc, cur) => {
|
||||
acc[cur.value] = cur.text
|
||||
return acc
|
||||
}, {})
|
||||
const labels = days.map(d => map[d] || d)
|
||||
return labels.join(', ')
|
||||
},
|
||||
|
||||
async getAudioContentSeries() {
|
||||
this.is_loading = true
|
||||
|
||||
@@ -411,96 +176,6 @@ export default {
|
||||
async next() {
|
||||
await this.getAudioContentSeries()
|
||||
},
|
||||
|
||||
openEditDialog(item) {
|
||||
this.edit_target = item
|
||||
this.show_edit_dialog = true
|
||||
this.is_saving = false
|
||||
this.loadGenresThenInit()
|
||||
},
|
||||
|
||||
async loadGenresThenInit() {
|
||||
try {
|
||||
this.is_loading_genres = true
|
||||
if (!this.genre_list || this.genre_list.length === 0) {
|
||||
const res = await api.getAudioContentSeriesGenreList()
|
||||
if (res.status === 200 && res.data.success === true) {
|
||||
this.genre_list = res.data.data || []
|
||||
} else {
|
||||
this.notifyError(res.data.message || '장르 목록을 불러오지 못했습니다.')
|
||||
}
|
||||
}
|
||||
} catch (e) {
|
||||
this.notifyError('장르 목록을 불러오지 못했습니다. 다시 시도해 주세요.')
|
||||
} finally {
|
||||
this.is_loading_genres = false
|
||||
this.initEditForm()
|
||||
}
|
||||
},
|
||||
|
||||
initEditForm() {
|
||||
const item = this.edit_target || {}
|
||||
let genreId = item.genreId || null
|
||||
if (!genreId && item.genre && this.genre_list && this.genre_list.length > 0) {
|
||||
const found = this.genre_list.find(g => g.genre === item.genre)
|
||||
if (found) genreId = found.id
|
||||
}
|
||||
// 초기 publishedDaysOfWeek 정규화 (RANDOM과 특정 요일 혼재 금지)
|
||||
let published = Array.isArray(item.publishedDaysOfWeek) ? [...item.publishedDaysOfWeek] : []
|
||||
if (published.includes('RANDOM')) {
|
||||
const others = published.filter(v => v !== 'RANDOM')
|
||||
published = others.length > 0 ? ['RANDOM'] : ['RANDOM']
|
||||
}
|
||||
this.edit_form = {
|
||||
genreId: genreId,
|
||||
isOriginal: typeof item.isOriginal === 'boolean' ? item.isOriginal : false,
|
||||
isAdult: typeof item.isAdult === 'boolean' ? item.isAdult : false,
|
||||
publishedDaysOfWeek: published
|
||||
}
|
||||
},
|
||||
|
||||
cancelEdit() {
|
||||
this.show_edit_dialog = false
|
||||
this.edit_target = {}
|
||||
this.edit_form = {
|
||||
genreId: null,
|
||||
isOriginal: false,
|
||||
isAdult: false,
|
||||
publishedDaysOfWeek: []
|
||||
}
|
||||
},
|
||||
|
||||
async saveEdit() {
|
||||
if (this.is_saving) return
|
||||
if (!this.edit_form.genreId) {
|
||||
this.notifyError('장르를 선택해 주세요.')
|
||||
return
|
||||
}
|
||||
this.is_saving = true
|
||||
try {
|
||||
const days = Array.isArray(this.edit_form.publishedDaysOfWeek) ? this.edit_form.publishedDaysOfWeek : []
|
||||
const payloadDays = days.includes('RANDOM') ? ['RANDOM'] : days
|
||||
const request = {
|
||||
seriesId: this.edit_target.id,
|
||||
genreId: this.edit_form.genreId,
|
||||
isOriginal: this.edit_form.isOriginal,
|
||||
isAdult: this.edit_form.isAdult,
|
||||
publishedDaysOfWeek: payloadDays
|
||||
}
|
||||
const res = await api.updateAudioContentSeries(request)
|
||||
if (res.status === 200 && res.data.success === true) {
|
||||
this.notifySuccess('수정되었습니다.')
|
||||
this.show_edit_dialog = false
|
||||
await this.getAudioContentSeries()
|
||||
} else {
|
||||
this.notifyError(res.data.message || '수정에 실패했습니다. 다시 시도해 주세요.')
|
||||
}
|
||||
} catch (e) {
|
||||
this.notifyError('수정에 실패했습니다. 다시 시도해 주세요.')
|
||||
} finally {
|
||||
this.is_saving = false
|
||||
}
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
Reference in New Issue
Block a user