콘텐츠 배너 등록/수정
- 크리에이터 배너 등록시 크리에이터를 검색해서 등록할 수 있도록 수정
This commit is contained in:
Yu Sung
7
package-lock.json
generated
7
package-lock.json
generated
@@ -10,6 +10,7 @@
|
||||
"dependencies": {
|
||||
"core-js": "^3.6.5",
|
||||
"file-saver": "^2.0.5",
|
||||
"lodash": "^4.17.21",
|
||||
"vue": "^2.6.11",
|
||||
"vue-excel-xlsx": "^1.2.2",
|
||||
"vue-router": "^3.2.0",
|
||||
@@ -9025,8 +9026,7 @@
|
||||
"node_modules/lodash": {
|
||||
"version": "4.17.21",
|
||||
"resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.21.tgz",
|
||||
"integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==",
|
||||
"dev": true
|
||||
"integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg=="
|
||||
},
|
||||
"node_modules/lodash.debounce": {
|
||||
"version": "4.0.8",
|
||||
@@ -22908,8 +22908,7 @@
|
||||
"lodash": {
|
||||
"version": "4.17.21",
|
||||
"resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.21.tgz",
|
||||
"integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==",
|
||||
"dev": true
|
||||
"integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg=="
|
||||
},
|
||||
"lodash.debounce": {
|
||||
"version": "4.0.8",
|
||||
|
||||
@@ -12,6 +12,7 @@
|
||||
"dependencies": {
|
||||
"core-js": "^3.6.5",
|
||||
"file-saver": "^2.0.5",
|
||||
"lodash": "^4.17.21",
|
||||
"vue": "^2.6.11",
|
||||
"vue-excel-xlsx": "^1.2.2",
|
||||
"vue-router": "^3.2.0",
|
||||
|
||||
@@ -69,7 +69,12 @@
|
||||
</template>
|
||||
|
||||
<v-card>
|
||||
<v-card-title>배너 등록</v-card-title>
|
||||
<v-card-title v-if="is_modify === true">
|
||||
배너 수정
|
||||
</v-card-title>
|
||||
<v-card-title v-else>
|
||||
배너 등록
|
||||
</v-card-title>
|
||||
<v-card-text>
|
||||
<v-row align="center">
|
||||
<v-col cols="4">
|
||||
@@ -102,12 +107,19 @@
|
||||
크리에이터
|
||||
</v-col>
|
||||
<v-col cols="8">
|
||||
<v-select
|
||||
v-model="banner.creator_id"
|
||||
<v-combobox
|
||||
v-model="banner.creator_nickname"
|
||||
:items="creators"
|
||||
:loading="is_loading"
|
||||
:search-input.sync="search_query_creator"
|
||||
label="크리에이터를 검색하세요"
|
||||
item-text="name"
|
||||
item-value="value"
|
||||
label="크리에이터 선택"
|
||||
no-data-text="No results found"
|
||||
hide-selected
|
||||
clearable
|
||||
@change="onSelect"
|
||||
@update:search-input="onSearchUpdate"
|
||||
/>
|
||||
</v-col>
|
||||
</v-row>
|
||||
@@ -234,6 +246,7 @@
|
||||
|
||||
<script>
|
||||
import Draggable from "vuedraggable";
|
||||
import debounce from "lodash/debounce";
|
||||
|
||||
import * as memberApi from "@/api/member";
|
||||
import * as eventApi from "@/api/event";
|
||||
@@ -246,6 +259,7 @@ export default {
|
||||
|
||||
data() {
|
||||
return {
|
||||
is_selecting: false,
|
||||
is_loading: false,
|
||||
is_modify: false,
|
||||
show_write_dialog: false,
|
||||
@@ -255,15 +269,27 @@ export default {
|
||||
banners: [],
|
||||
events: [],
|
||||
creators: [],
|
||||
search_query_creator: '',
|
||||
}
|
||||
},
|
||||
|
||||
watch: {
|
||||
search_query_creator() {
|
||||
if (!this.is_selecting) {
|
||||
this.debouncedSearch();
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
async created() {
|
||||
await this.getCreatorAllList()
|
||||
await this.getEvents()
|
||||
await this.getBanners()
|
||||
},
|
||||
|
||||
mounted() {
|
||||
this.debouncedSearch = debounce(this.searchCreator, 500);
|
||||
},
|
||||
|
||||
methods: {
|
||||
imageAdd(payload) {
|
||||
const file = payload;
|
||||
@@ -294,6 +320,8 @@ export default {
|
||||
this.is_modify = true
|
||||
this.selected_banner = banner
|
||||
|
||||
this.is_selecting = true; // 선택 중 플래그 활성화
|
||||
|
||||
this.banner.id = banner.id
|
||||
this.banner.type = banner.type
|
||||
this.banner.thumbnail_image_url = banner.thumbnailImageUrl
|
||||
@@ -304,6 +332,10 @@ export default {
|
||||
this.banner.link = banner.link
|
||||
this.banner.is_adult = banner.isAdult
|
||||
|
||||
setTimeout(() => {
|
||||
this.is_selecting = false; // 선택 상태 해제
|
||||
}, 1000);
|
||||
|
||||
this.show_write_dialog = true
|
||||
},
|
||||
|
||||
@@ -485,19 +517,23 @@ export default {
|
||||
}
|
||||
},
|
||||
|
||||
async getCreatorAllList() {
|
||||
this.is_loading = true
|
||||
async searchCreator() {
|
||||
if (this.search_query_creator === null || this.search_query_creator.length < 3) {
|
||||
this.creators = [];
|
||||
return;
|
||||
}
|
||||
|
||||
this.is_loading = true;
|
||||
|
||||
try {
|
||||
const res = await memberApi.getCreatorAllList()
|
||||
const res = await memberApi.searchCreator(this.search_query_creator, 1);
|
||||
|
||||
if (res.status === 200 && res.data.success === true) {
|
||||
this.creators = res.data.data.map((item) => {
|
||||
this.creators = res.data.data.items.map((item) => {
|
||||
return {name: item.nickname, value: item.id}
|
||||
})
|
||||
} else {
|
||||
this.notifyError(res.data.message || '알 수 없는 오류가 발생했습니다. 다시 시도해 주세요.')
|
||||
this.is_loading = false
|
||||
this.creators = []
|
||||
}
|
||||
} catch (e) {
|
||||
this.notifyError('알 수 없는 오류가 발생했습니다. 다시 시도해 주세요.')
|
||||
@@ -507,12 +543,26 @@ export default {
|
||||
}
|
||||
},
|
||||
|
||||
onSelect(value) {
|
||||
this.banner.creator_id = value.value
|
||||
this.is_selecting = true; // 선택 중 플래그 활성화
|
||||
setTimeout(() => {
|
||||
this.is_selecting = false; // 선택 상태 해제
|
||||
}, 0);
|
||||
},
|
||||
|
||||
onSearchUpdate(value) {
|
||||
if (!this.is_selecting) {
|
||||
this.search_query_creator = value
|
||||
}
|
||||
},
|
||||
|
||||
async getEvents() {
|
||||
this.is_loading = true
|
||||
try {
|
||||
const res = await eventApi.getEvents(1)
|
||||
if (res.status === 200 && res.data.success === true) {
|
||||
this.events = res.data.data.eventList.map((item) => {
|
||||
this.events = res.data.data.map((item) => {
|
||||
return {title: item.title, value: item.id}
|
||||
})
|
||||
} else {
|
||||
|
||||
Reference in New Issue
Block a user