first commit
This commit is contained in:
Yu Sung
13
src/views/Promotion/BannerView.vue
Normal file
13
src/views/Promotion/BannerView.vue
Normal file
@@ -0,0 +1,13 @@
|
||||
<template>
|
||||
<div>배너 관리</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: "BannerView"
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
415
src/views/Promotion/ChargeEvent.vue
Normal file
415
src/views/Promotion/ChargeEvent.vue
Normal file
@@ -0,0 +1,415 @@
|
||||
<template>
|
||||
<div>
|
||||
<v-toolbar dark>
|
||||
<v-spacer />
|
||||
<v-toolbar-title>충전 이벤트</v-toolbar-title>
|
||||
<v-spacer />
|
||||
</v-toolbar>
|
||||
|
||||
<br>
|
||||
|
||||
<v-container>
|
||||
<v-row>
|
||||
<v-col cols="10" />
|
||||
<v-col>
|
||||
<v-btn
|
||||
block
|
||||
color="#9970ff"
|
||||
dark
|
||||
depressed
|
||||
@click="showWriteDialog"
|
||||
>
|
||||
충전 이벤트 등록
|
||||
</v-btn>
|
||||
</v-col>
|
||||
</v-row>
|
||||
|
||||
<v-row>
|
||||
<v-col>
|
||||
<v-data-table
|
||||
:headers="headers"
|
||||
:items="charge_event_list"
|
||||
:loading="is_loading"
|
||||
:items-per-page="-1"
|
||||
item-key="id"
|
||||
class="elevation-1"
|
||||
hide-default-footer
|
||||
>
|
||||
<template v-slot:item.title="{ item }">
|
||||
{{ item.title }}
|
||||
</template>
|
||||
|
||||
<template v-slot:item.period="{ item }">
|
||||
{{ item.startDate }} ~ {{ item.endDate }}
|
||||
</template>
|
||||
|
||||
<template v-slot:item.availableCount="{ item }">
|
||||
{{ item.availableCount }} 번 참여가능
|
||||
</template>
|
||||
|
||||
<template v-slot:item.addPercent="{ item }">
|
||||
{{ item.addPercent }} %
|
||||
</template>
|
||||
|
||||
<template v-slot:item.isActive="{ item }">
|
||||
<div v-if="item.isActive">
|
||||
O
|
||||
</div>
|
||||
<div v-else>
|
||||
X
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<template v-slot:item.management="{ item }">
|
||||
<v-btn
|
||||
:disabled="is_loading"
|
||||
@click="showModifyDialog(item)"
|
||||
>
|
||||
수정
|
||||
</v-btn>
|
||||
</template>
|
||||
</v-data-table>
|
||||
</v-col>
|
||||
</v-row>
|
||||
</v-container>
|
||||
<v-row>
|
||||
<v-dialog
|
||||
v-model="show_write_dialog"
|
||||
max-width="1000px"
|
||||
persistent
|
||||
>
|
||||
<v-card>
|
||||
<v-card-title>충전 이벤트 등록</v-card-title>
|
||||
<v-card-text>
|
||||
<v-text-field
|
||||
v-model="title"
|
||||
label="제목"
|
||||
required
|
||||
/>
|
||||
</v-card-text>
|
||||
<v-card-text>
|
||||
<v-text-field
|
||||
v-model="available_count"
|
||||
label="참여가능 횟수"
|
||||
required
|
||||
/>
|
||||
</v-card-text>
|
||||
<v-card-text>
|
||||
<v-text-field
|
||||
v-model="add_percent"
|
||||
label="추가 충전 %"
|
||||
required
|
||||
/>
|
||||
</v-card-text>
|
||||
<v-card-text>
|
||||
<v-row align="center">
|
||||
<v-col cols="4">
|
||||
기간
|
||||
</v-col>
|
||||
<v-col
|
||||
cols="8"
|
||||
class="datepicker-wrapper"
|
||||
>
|
||||
<datetime
|
||||
v-model="start_date"
|
||||
class="datepicker"
|
||||
format="YYYY-MM-DD"
|
||||
/>
|
||||
<div> ~ </div>
|
||||
<datetime
|
||||
v-model="end_date"
|
||||
class="datepicker"
|
||||
format="YYYY-MM-DD"
|
||||
/>
|
||||
</v-col>
|
||||
</v-row>
|
||||
</v-card-text>
|
||||
<v-card-text v-show="selected_charge_event !== null">
|
||||
<v-row align="center">
|
||||
<v-col cols="4">
|
||||
활성화
|
||||
</v-col>
|
||||
<v-col cols="8">
|
||||
<input
|
||||
v-model="is_active"
|
||||
type="checkbox"
|
||||
>
|
||||
</v-col>
|
||||
</v-row>
|
||||
</v-card-text>
|
||||
<v-card-actions v-show="!is_loading">
|
||||
<v-spacer />
|
||||
<v-btn
|
||||
color="blue darken-1"
|
||||
text
|
||||
@click="cancel"
|
||||
>
|
||||
취소
|
||||
</v-btn>
|
||||
<v-btn
|
||||
v-if="selected_charge_event !== null"
|
||||
color="blue darken-1"
|
||||
text
|
||||
@click="modify"
|
||||
>
|
||||
수정
|
||||
</v-btn>
|
||||
<v-btn
|
||||
v-else
|
||||
color="blue darken-1"
|
||||
text
|
||||
@click="validate"
|
||||
>
|
||||
등록
|
||||
</v-btn>
|
||||
</v-card-actions>
|
||||
</v-card>
|
||||
</v-dialog>
|
||||
</v-row>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import * as api from '@/api/charge_event'
|
||||
import datetime from 'vuejs-datetimepicker';
|
||||
|
||||
export default {
|
||||
name: "ChargeEvent",
|
||||
components: { datetime },
|
||||
|
||||
data() {
|
||||
return {
|
||||
is_loading: false,
|
||||
show_write_dialog: false,
|
||||
|
||||
selected_charge_event: null,
|
||||
title: null,
|
||||
start_date: null,
|
||||
end_date: null,
|
||||
available_count: null,
|
||||
add_percent: null,
|
||||
is_active: null,
|
||||
|
||||
charge_event_list: [],
|
||||
headers: [
|
||||
{
|
||||
text: '제목',
|
||||
align: 'center',
|
||||
sortable: false,
|
||||
value: 'title',
|
||||
},
|
||||
{
|
||||
text: '기간',
|
||||
align: 'center',
|
||||
sortable: false,
|
||||
value: 'period',
|
||||
},
|
||||
{
|
||||
text: '참여가능 횟수',
|
||||
align: 'center',
|
||||
sortable: false,
|
||||
value: 'availableCount',
|
||||
},
|
||||
{
|
||||
text: '추가 충전 %',
|
||||
align: 'center',
|
||||
sortable: false,
|
||||
value: 'addPercent',
|
||||
},
|
||||
{
|
||||
text: '활성화',
|
||||
align: 'center',
|
||||
sortable: false,
|
||||
value: 'isActive',
|
||||
},
|
||||
{
|
||||
text: '관리',
|
||||
align: 'center',
|
||||
sortable: false,
|
||||
value: 'management'
|
||||
},
|
||||
],
|
||||
}
|
||||
},
|
||||
|
||||
async created() {
|
||||
await this.getChargeEventList();
|
||||
},
|
||||
|
||||
methods: {
|
||||
notifyError(message) {
|
||||
this.$dialog.notify.error(message)
|
||||
},
|
||||
|
||||
notifySuccess(message) {
|
||||
this.$dialog.notify.success(message)
|
||||
},
|
||||
|
||||
showWriteDialog() {
|
||||
this.show_write_dialog = true
|
||||
},
|
||||
|
||||
showModifyDialog(item) {
|
||||
this.selected_charge_event = item;
|
||||
this.title = item.title;
|
||||
this.add_percent = item.addPercent;
|
||||
this.available_count = item.availableCount;
|
||||
this.start_date = item.startDate;
|
||||
this.end_date = item.endDate;
|
||||
this.is_active = item.isActive;
|
||||
this.show_write_dialog = true
|
||||
},
|
||||
|
||||
validate() {
|
||||
if (this.title === null) {
|
||||
this.notifyError('제목을 입력하세요.')
|
||||
return
|
||||
}
|
||||
|
||||
if (this.available_count === null) {
|
||||
this.notifyError('참여가능 횟수를 입력하세요.')
|
||||
return
|
||||
}
|
||||
|
||||
if (isNaN(this.available_count)) {
|
||||
this.notifyError('참여가능 횟수는 숫자만 입력 가능합니다.')
|
||||
return
|
||||
}
|
||||
|
||||
if (this.add_percent === null) {
|
||||
this.notifyError('추가 충전 비율(%)을 입력하세요')
|
||||
return
|
||||
}
|
||||
|
||||
if (isNaN(this.add_percent)) {
|
||||
this.notifyError('추가 충전 비율(%)은 숫자만 입력 가능합니다.')
|
||||
return
|
||||
}
|
||||
|
||||
if (this.start_date === null || this.end_date === null) {
|
||||
this.notifyError('이벤트 기간을 입력하세요.')
|
||||
return
|
||||
}
|
||||
|
||||
this.submit()
|
||||
},
|
||||
|
||||
cancel() {
|
||||
this.selected_charge_event = null;
|
||||
this.title = null;
|
||||
this.add_percent = null;
|
||||
this.available_count = null;
|
||||
this.start_date = null;
|
||||
this.end_date = null;
|
||||
this.show_write_dialog = false
|
||||
},
|
||||
|
||||
async submit() {
|
||||
if (this.is_loading) return;
|
||||
|
||||
this.is_loading = true
|
||||
|
||||
try {
|
||||
const res = await api.save(
|
||||
this.title,
|
||||
this.start_date,
|
||||
this.end_date,
|
||||
this.available_count,
|
||||
this.add_percent
|
||||
)
|
||||
|
||||
if (res.status === 200 && res.data.success === true) {
|
||||
this.cancel()
|
||||
this.notifySuccess(res.data.message || '등록되었습니다.')
|
||||
|
||||
this.charge_event_list = [];
|
||||
await this.getChargeEventList()
|
||||
} else {
|
||||
this.notifyError(res.data.message || '알 수 없는 오류가 발생했습니다. 다시 시도해 주세요.')
|
||||
}
|
||||
} catch (e) {
|
||||
this.notifyError("알 수 없는 오류가 발생했습니다. 다시 시도해 주세요.")
|
||||
}
|
||||
|
||||
this.is_loading = false
|
||||
},
|
||||
|
||||
async modify() {
|
||||
if (this.is_loading) return;
|
||||
|
||||
this.isLoading = true
|
||||
|
||||
try {
|
||||
const res = await api.modify(
|
||||
this.selected_charge_event.id,
|
||||
this.title !== this.selected_charge_event.title ? this.title : null,
|
||||
this.start_date !== this.selected_charge_event.startDate ? this.start_date : null,
|
||||
this.end_date !== this.selected_charge_event.endDate ? this.end_date : null,
|
||||
this.available_count !== this.selected_charge_event.availableCount ? this.available_count : null,
|
||||
this.add_percent !== this.selected_charge_event.addPercent ? this.add_percent : null,
|
||||
this.is_active !== this.selected_charge_event.isActive ? this.is_active : null
|
||||
)
|
||||
|
||||
if (res.status === 200 && res.data.success === true) {
|
||||
this.cancel()
|
||||
this.notifySuccess(res.data.message || '수정되었습니다.')
|
||||
|
||||
this.charge_event_list = [];
|
||||
await this.getChargeEventList()
|
||||
} else {
|
||||
this.notifyError(res.data.message || '알 수 없는 오류가 발생했습니다. 다시 시도해 주세요.')
|
||||
}
|
||||
} catch (e) {
|
||||
this.notifyError("알 수 없는 오류가 발생했습니다. 다시 시도해 주세요.")
|
||||
}
|
||||
},
|
||||
|
||||
async getChargeEventList() {
|
||||
this.is_loading = true
|
||||
|
||||
try {
|
||||
const res = await api.getChargeEventList();
|
||||
|
||||
if (res.status === 200 && res.data.success === true) {
|
||||
this.charge_event_list = res.data.data
|
||||
} else {
|
||||
this.notifyError('알 수 없는 오류가 발생했습니다. 다시 시도해 주세요.')
|
||||
}
|
||||
|
||||
this.is_loading = false
|
||||
} catch (e) {
|
||||
this.notifyError('알 수 없는 오류가 발생했습니다. 다시 시도해 주세요.')
|
||||
this.is_loading = false
|
||||
}
|
||||
}
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.datepicker {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.datepicker-wrapper {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
}
|
||||
|
||||
.datepicker-wrapper > div {
|
||||
margin: 20px;
|
||||
}
|
||||
|
||||
.v-card__text {
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
||||
.v-card__actions {
|
||||
margin-top: 100px;
|
||||
}
|
||||
|
||||
.v-card__actions > .v-btn {
|
||||
font-size: 20px;
|
||||
|
||||
}
|
||||
</style>
|
||||
495
src/views/Promotion/EventView.vue
Normal file
495
src/views/Promotion/EventView.vue
Normal file
@@ -0,0 +1,495 @@
|
||||
<template>
|
||||
<div>
|
||||
<v-toolbar dark>
|
||||
<v-spacer />
|
||||
<v-toolbar-title>이벤트 관리</v-toolbar-title>
|
||||
<v-spacer />
|
||||
</v-toolbar>
|
||||
|
||||
<br>
|
||||
|
||||
<v-container>
|
||||
<v-row>
|
||||
<v-col cols="10" />
|
||||
<v-col>
|
||||
<v-btn
|
||||
block
|
||||
color="#9970ff"
|
||||
dark
|
||||
depressed
|
||||
@click="showWriteDialog"
|
||||
>
|
||||
이벤트 등록
|
||||
</v-btn>
|
||||
</v-col>
|
||||
</v-row>
|
||||
<v-row>
|
||||
<v-col
|
||||
v-for="(item, i) in events"
|
||||
:key="i"
|
||||
cols="3"
|
||||
>
|
||||
<v-card>
|
||||
<v-card-title>
|
||||
<v-spacer />
|
||||
<v-img
|
||||
:src="item.thumbnailImageUrl"
|
||||
@click="clickEvent(item)"
|
||||
/>
|
||||
<v-spacer />
|
||||
</v-card-title>
|
||||
</v-card>
|
||||
</v-col>
|
||||
</v-row>
|
||||
<v-row class="text-center">
|
||||
<v-col>
|
||||
<v-pagination
|
||||
v-model="page"
|
||||
:length="total_page"
|
||||
circle
|
||||
@input="next"
|
||||
/>
|
||||
</v-col>
|
||||
</v-row>
|
||||
</v-container>
|
||||
<v-row>
|
||||
<v-dialog
|
||||
v-model="show_write_dialog"
|
||||
max-width="1000px"
|
||||
persistent
|
||||
>
|
||||
<v-card>
|
||||
<v-card-text />
|
||||
<v-card-title v-show="!is_modify">
|
||||
이벤트 등록
|
||||
</v-card-title>
|
||||
<v-card-title v-show="is_modify">
|
||||
이벤트 수정
|
||||
</v-card-title>
|
||||
<v-card-text>
|
||||
<v-text-field
|
||||
v-model="event.title"
|
||||
label="제목"
|
||||
required
|
||||
/>
|
||||
</v-card-text>
|
||||
<v-card-text>
|
||||
<div class="image-select">
|
||||
<label for="thumbnailImage">
|
||||
썸네일 등록
|
||||
</label>
|
||||
<v-file-input
|
||||
id="thumbnailImage"
|
||||
v-model="event.thumbnailImage"
|
||||
@change="thumbnailImageAdd"
|
||||
/>
|
||||
</div>
|
||||
<img
|
||||
v-if="event.thumbnailImageUrl"
|
||||
:src="event.thumbnailImageUrl"
|
||||
alt=""
|
||||
class="image-preview"
|
||||
>
|
||||
</v-card-text>
|
||||
<v-card-text>
|
||||
<div class="image-select">
|
||||
<label for="detailImage">
|
||||
상세 이미지 등록
|
||||
</label>
|
||||
<v-file-input
|
||||
id="detailImage"
|
||||
v-model="event.detailImage"
|
||||
@change="detailImageAdd"
|
||||
/>
|
||||
</div>
|
||||
<img
|
||||
v-if="event.detailImageUrl"
|
||||
:src="event.detailImageUrl"
|
||||
alt=""
|
||||
class="image-preview"
|
||||
>
|
||||
</v-card-text>
|
||||
<v-card-text>
|
||||
<div class="image-select">
|
||||
<label for="popupImage">
|
||||
팝업 이미지 등록
|
||||
</label>
|
||||
<v-file-input
|
||||
id="popupImage"
|
||||
v-model="event.popupImage"
|
||||
@change="popupImageAdd"
|
||||
/>
|
||||
</div>
|
||||
<img
|
||||
v-if="event.popupImageUrl"
|
||||
:src="event.popupImageUrl"
|
||||
alt=""
|
||||
class="image-preview"
|
||||
>
|
||||
</v-card-text>
|
||||
<v-card-text>
|
||||
<v-text-field
|
||||
v-model="event.link"
|
||||
label="link"
|
||||
required
|
||||
/>
|
||||
</v-card-text>
|
||||
<v-card-text>
|
||||
<v-row>
|
||||
<v-col cols="4">
|
||||
팝업
|
||||
</v-col>
|
||||
<v-col cols="8">
|
||||
<input
|
||||
v-model="event.isPopup"
|
||||
type="checkbox"
|
||||
>
|
||||
</v-col>
|
||||
</v-row>
|
||||
</v-card-text>
|
||||
<v-card-actions v-show="!is_loading">
|
||||
<v-btn
|
||||
v-show="is_modify"
|
||||
color="blue darken-1"
|
||||
text
|
||||
@click="deleteConfirm"
|
||||
>
|
||||
삭제
|
||||
</v-btn>
|
||||
<v-spacer />
|
||||
<v-btn
|
||||
color="blue darken-1"
|
||||
text
|
||||
@click="cancel"
|
||||
>
|
||||
취소
|
||||
</v-btn>
|
||||
<v-btn
|
||||
v-show="!is_modify"
|
||||
color="blue darken-1"
|
||||
text
|
||||
@click="submit"
|
||||
>
|
||||
등록
|
||||
</v-btn>
|
||||
<v-btn
|
||||
v-show="is_modify"
|
||||
color="blue darken-1"
|
||||
text
|
||||
@click="modify"
|
||||
>
|
||||
수정
|
||||
</v-btn>
|
||||
</v-card-actions>
|
||||
</v-card>
|
||||
</v-dialog>
|
||||
</v-row>
|
||||
<v-row>
|
||||
<v-dialog
|
||||
v-model="show_delete_confirm_dialog"
|
||||
max-width="400px"
|
||||
persistent
|
||||
>
|
||||
<v-card>
|
||||
<v-card-text />
|
||||
<v-card-text>
|
||||
삭제하시겠습니까?
|
||||
</v-card-text>
|
||||
<v-card-actions v-show="!is_loading">
|
||||
<v-spacer />
|
||||
<v-btn
|
||||
color="blue darken-1"
|
||||
text
|
||||
@click="deleteCancel"
|
||||
>
|
||||
취소
|
||||
</v-btn>
|
||||
<v-btn
|
||||
color="blue darken-1"
|
||||
text
|
||||
@click="deleteEvent"
|
||||
>
|
||||
확인
|
||||
</v-btn>
|
||||
</v-card-actions>
|
||||
</v-card>
|
||||
</v-dialog>
|
||||
</v-row>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import * as api from '@/api/event'
|
||||
|
||||
export default {
|
||||
name: "EventView",
|
||||
|
||||
data() {
|
||||
return {
|
||||
is_loading: false,
|
||||
is_modify: false,
|
||||
page: 1,
|
||||
events: [],
|
||||
event: {},
|
||||
show_write_dialog: false,
|
||||
show_delete_confirm_dialog: false,
|
||||
}
|
||||
},
|
||||
|
||||
async created() {
|
||||
await this.getEvents()
|
||||
},
|
||||
|
||||
methods: {
|
||||
notifyError(message) {
|
||||
this.$dialog.notify.error(message)
|
||||
},
|
||||
|
||||
notifySuccess(message) {
|
||||
this.$dialog.notify.success(message)
|
||||
},
|
||||
|
||||
thumbnailImageAdd(payload) {
|
||||
const file = payload;
|
||||
if (file) {
|
||||
this.event.thumbnailImageUrl = URL.createObjectURL(file)
|
||||
URL.revokeObjectURL(file)
|
||||
} else {
|
||||
this.event.thumbnailImageUrl = null
|
||||
}
|
||||
},
|
||||
|
||||
detailImageAdd(payload) {
|
||||
const file = payload;
|
||||
if (file) {
|
||||
this.event.detailImageUrl = URL.createObjectURL(file)
|
||||
URL.revokeObjectURL(file)
|
||||
} else {
|
||||
this.event.detailImageUrl = null
|
||||
}
|
||||
},
|
||||
|
||||
popupImageAdd(payload) {
|
||||
const file = payload;
|
||||
if (file) {
|
||||
this.event.popupImageUrl = URL.createObjectURL(file)
|
||||
URL.revokeObjectURL(file)
|
||||
} else {
|
||||
this.event.popupImageUrl = null
|
||||
}
|
||||
},
|
||||
|
||||
async getEvents() {
|
||||
this.is_loading = true
|
||||
|
||||
try {
|
||||
const res = await api.getEvents(this.page)
|
||||
if (res.status === 200 && res.data.success === true) {
|
||||
this.events = res.data.data.eventList
|
||||
} else {
|
||||
this.notifyError(res.data.message || '알 수 없는 오류가 발생했습니다. 다시 시도해 주세요.')
|
||||
}
|
||||
} catch (e) {
|
||||
this.notifyError('알 수 없는 오류가 발생했습니다. 다시 시도해 주세요.')
|
||||
} finally {
|
||||
this.is_loading = false
|
||||
}
|
||||
},
|
||||
|
||||
async next() {
|
||||
await this.getEvents()
|
||||
},
|
||||
|
||||
showWriteDialog() {
|
||||
this.show_write_dialog = true
|
||||
},
|
||||
|
||||
clickEvent(item) {
|
||||
this.is_modify = true
|
||||
this.event.id = item.id
|
||||
this.event.thumbnailImageUrl = item.thumbnailImageUrl
|
||||
this.event.detailImageUrl = item.detailImageUrl
|
||||
this.event.link = item.link
|
||||
this.event.title = item.title
|
||||
this.event.isPopup = item.isPopup
|
||||
this.event.popupImageUrl = item.popupImageUrl
|
||||
this.show_write_dialog = true
|
||||
},
|
||||
|
||||
cancel() {
|
||||
this.is_modify = false
|
||||
this.event = {}
|
||||
this.show_write_dialog = false
|
||||
},
|
||||
|
||||
validate() {
|
||||
if (this.event.title == null) {
|
||||
this.notifyError("제목을 입력하세요")
|
||||
return false;
|
||||
}
|
||||
|
||||
if (this.event.thumbnailImage == null) {
|
||||
this.notifyError("썸네일 이미지를 등록하세요")
|
||||
return false;
|
||||
}
|
||||
|
||||
if ((this.event.link == null || this.event.link.trim().length <= 0) && this.event.detailImage == null) {
|
||||
this.notifyError("상세이미지 혹은 link 둘 중 하나는 반드시 입력해야 합니다.")
|
||||
return false;
|
||||
}
|
||||
|
||||
return true
|
||||
},
|
||||
|
||||
async submit() {
|
||||
if (!this.validate()) return;
|
||||
if (this.is_loading) return;
|
||||
|
||||
this.is_loading = true
|
||||
|
||||
try {
|
||||
const formData = new FormData()
|
||||
formData.append("title", this.event.title)
|
||||
formData.append("thumbnail", this.event.thumbnailImage)
|
||||
formData.append("isPopup", this.event.isPopup ? this.event.isPopup : false)
|
||||
|
||||
if (this.event.detailImage != null) {
|
||||
formData.append("detail", this.event.detailImage)
|
||||
}
|
||||
|
||||
if (this.event.popupImage != null) {
|
||||
formData.append("popup", this.event.popupImage)
|
||||
}
|
||||
|
||||
if (this.event.link != null && this.event.link.trim().length > 0) {
|
||||
formData.append("link", this.event.link)
|
||||
}
|
||||
|
||||
const res = await api.save(formData)
|
||||
if (res.status === 200 && res.data.success === true) {
|
||||
this.show_write_dialog = false
|
||||
this.notifySuccess('등록되었습니다.')
|
||||
this.page = 1
|
||||
await this.getEvents()
|
||||
this.event = {}
|
||||
}
|
||||
} catch (e) {
|
||||
this.notifyError('알 수 없는 오류가 발생했습니다. 다시 시도해 주세요.')
|
||||
} finally {
|
||||
this.is_loading = false
|
||||
}
|
||||
},
|
||||
|
||||
async modify() {
|
||||
if (this.is_loading) return;
|
||||
|
||||
this.is_loading = true
|
||||
try {
|
||||
const formData = new FormData()
|
||||
formData.append("id", this.event.id)
|
||||
|
||||
if (this.event.title != null && this.event.title.trim().length > 0) {
|
||||
formData.append("title", this.event.title)
|
||||
}
|
||||
|
||||
if (this.event.thumbnailImage != null) {
|
||||
formData.append("thumbnail", this.event.thumbnailImage)
|
||||
}
|
||||
|
||||
if (this.event.detailImage != null) {
|
||||
formData.append("detail", this.event.detailImage)
|
||||
}
|
||||
|
||||
if (this.event.popupImage != null) {
|
||||
formData.append("popup", this.event.popupImage)
|
||||
}
|
||||
|
||||
if (this.event.isPopup != null) {
|
||||
formData.append("isPopup", this.event.isPopup)
|
||||
}
|
||||
|
||||
if (this.event.link != null && this.event.link.trim().length > 0) {
|
||||
formData.append("link", this.event.link)
|
||||
}
|
||||
|
||||
const res = await api.modify(formData)
|
||||
if (res.status === 200 && res.data.success === true) {
|
||||
this.show_write_dialog = false
|
||||
this.notifySuccess('수정되었습니다.')
|
||||
this.page = 1
|
||||
await this.getEvents()
|
||||
this.event = {}
|
||||
this.is_modify = false
|
||||
} else {
|
||||
this.notifyError(res.data.message || '알 수 없는 오류가 발생했습니다. 다시 시도해 주세요.')
|
||||
}
|
||||
} catch (e) {
|
||||
this.notifyError('알 수 없는 오류가 발생했습니다. 다시 시도해 주세요.')
|
||||
} finally {
|
||||
this.is_loading = false
|
||||
}
|
||||
},
|
||||
|
||||
deleteConfirm() {
|
||||
this.show_delete_confirm_dialog = true
|
||||
},
|
||||
|
||||
deleteCancel() {
|
||||
this.show_delete_confirm_dialog = false
|
||||
},
|
||||
|
||||
async deleteEvent() {
|
||||
if (this.is_loading) return;
|
||||
this.is_loading = true
|
||||
|
||||
try {
|
||||
const res = await api.deleteEvent(this.event.id)
|
||||
if (res.status === 200 && res.data.success === true) {
|
||||
this.show_write_dialog = false
|
||||
this.show_delete_confirm_dialog = false
|
||||
this.notifySuccess('삭제되었습니다.')
|
||||
this.page = 1
|
||||
await this.getEvents()
|
||||
this.event = {}
|
||||
this.is_modify = false
|
||||
} else {
|
||||
this.notifyError(res.data.message || '알 수 없는 오류가 발생했습니다. 다시 시도해 주세요.')
|
||||
}
|
||||
} catch (e) {
|
||||
this.notifyError('알 수 없는 오류가 발생했습니다. 다시 시도해 주세요.')
|
||||
} finally {
|
||||
this.is_loading = false
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.image-select label {
|
||||
display: inline-block;
|
||||
padding: 10px 20px;
|
||||
background-color: #232d4a;
|
||||
color: #fff;
|
||||
vertical-align: middle;
|
||||
font-size: 15px;
|
||||
cursor: pointer;
|
||||
border-radius: 5px;
|
||||
}
|
||||
|
||||
.v-file-input {
|
||||
position: absolute;
|
||||
width: 0;
|
||||
height: 0;
|
||||
padding: 0;
|
||||
overflow: hidden;
|
||||
border: 0;
|
||||
}
|
||||
|
||||
.image-preview {
|
||||
max-width: 100%;
|
||||
width: 250px;
|
||||
object-fit: cover;
|
||||
margin-top: 10px;
|
||||
}
|
||||
</style>
|
||||
362
src/views/Promotion/PromotionCreatorRecommend.vue
Normal file
362
src/views/Promotion/PromotionCreatorRecommend.vue
Normal file
@@ -0,0 +1,362 @@
|
||||
<template>
|
||||
<div>
|
||||
<v-toolbar dark>
|
||||
<v-spacer />
|
||||
<v-toolbar-title>추천 상담친구 관리</v-toolbar-title>
|
||||
<v-spacer />
|
||||
</v-toolbar>
|
||||
|
||||
<br>
|
||||
|
||||
<v-container>
|
||||
<v-row>
|
||||
<v-col cols="10" />
|
||||
<v-col>
|
||||
<v-btn
|
||||
block
|
||||
color="#9970ff"
|
||||
dark
|
||||
depressed
|
||||
@click="showAddCounselorDialog"
|
||||
>
|
||||
추천 상담친구 추가
|
||||
</v-btn>
|
||||
</v-col>
|
||||
</v-row>
|
||||
<v-row>
|
||||
<v-col>
|
||||
<v-data-table
|
||||
:headers="headers"
|
||||
:items="recommendCounselorList"
|
||||
:loading="isLoading"
|
||||
class="elevation-1"
|
||||
hide-default-footer
|
||||
>
|
||||
<template v-slot:item.image="{ item }">
|
||||
<img
|
||||
:src="item.profileImageUrl"
|
||||
alt=""
|
||||
height="100"
|
||||
width="100"
|
||||
>
|
||||
</template>
|
||||
|
||||
<template v-slot:item.introduce="{ item }">
|
||||
<v-btn
|
||||
:disabled="isLoading"
|
||||
text
|
||||
color="blue darken-1"
|
||||
@click="showIntroduceDialog(item)"
|
||||
>
|
||||
[보기]
|
||||
</v-btn>
|
||||
</template>
|
||||
|
||||
<template v-slot:item.isCounseling="{ item }">
|
||||
<h3 v-if="item.isCounseling">
|
||||
O
|
||||
</h3>
|
||||
<h3 v-else>
|
||||
X
|
||||
</h3>
|
||||
</template>
|
||||
|
||||
<template v-slot:item.youtubeUrl="{ item }">
|
||||
<a :href="item.youtubeUrl">{{ item.youtubeUrl }}</a>
|
||||
</template>
|
||||
|
||||
<template v-slot:item.instagramUrl="{ item }">
|
||||
<a :href="item.instagramUrl">{{ item.instagramUrl }}</a>
|
||||
</template>
|
||||
|
||||
<template v-slot:item.management="{ item }">
|
||||
<v-btn
|
||||
:disabled="isLoading"
|
||||
class="white--text"
|
||||
color="blue darken-1"
|
||||
@click="deleteRecommendCounselor(item)"
|
||||
>
|
||||
삭제
|
||||
</v-btn>
|
||||
</template>
|
||||
</v-data-table>
|
||||
</v-col>
|
||||
</v-row>
|
||||
</v-container>
|
||||
|
||||
<v-row>
|
||||
<v-dialog
|
||||
v-model="show_add_counselor_dialog"
|
||||
max-width="400px"
|
||||
persistent
|
||||
>
|
||||
<v-card>
|
||||
<v-card-title>추천 상담친구 추가</v-card-title>
|
||||
<v-card-text>
|
||||
<v-row align="center">
|
||||
<v-col cols="4">
|
||||
추천친구
|
||||
</v-col>
|
||||
<v-col cols="8">
|
||||
<v-select
|
||||
v-model="counselor_id"
|
||||
:items="counselorList"
|
||||
item-text="name"
|
||||
item-value="value"
|
||||
label="수다친구 선택"
|
||||
/>
|
||||
</v-col>
|
||||
</v-row>
|
||||
</v-card-text>
|
||||
<v-card-actions v-show="!isLoading">
|
||||
<v-spacer />
|
||||
<v-btn
|
||||
color="blue darken-1"
|
||||
text
|
||||
@click="cancel"
|
||||
>
|
||||
취소
|
||||
</v-btn>
|
||||
<v-btn
|
||||
color="blue darken-1"
|
||||
text
|
||||
@click="validate"
|
||||
>
|
||||
추가
|
||||
</v-btn>
|
||||
</v-card-actions>
|
||||
</v-card>
|
||||
</v-dialog>
|
||||
</v-row>
|
||||
<v-row>
|
||||
<v-dialog
|
||||
v-model="show_introduce_dialog"
|
||||
max-width="400px"
|
||||
persistent
|
||||
>
|
||||
<v-card>
|
||||
<v-card-title>{{ counselor_nickname }} 소개</v-card-title>
|
||||
<v-card-text>
|
||||
{{ counselor_introduce }}
|
||||
</v-card-text>
|
||||
<v-card-actions>
|
||||
<v-spacer />
|
||||
<v-btn
|
||||
color="blue darken-1"
|
||||
text
|
||||
@click="closeIntroduceDialog"
|
||||
>
|
||||
확인
|
||||
</v-btn>
|
||||
<v-spacer />
|
||||
</v-card-actions>
|
||||
</v-card>
|
||||
</v-dialog>
|
||||
</v-row>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import * as accountApi from "@/api/member";
|
||||
import * as api from '@/api/recommend_counselor'
|
||||
|
||||
export default {
|
||||
name: "PromotionRecommendCounselor",
|
||||
data() {
|
||||
return {
|
||||
isLoading: false,
|
||||
counselor_id: null,
|
||||
counselorList: [],
|
||||
recommendCounselorList: [],
|
||||
headers: [
|
||||
{
|
||||
text: '회원번호',
|
||||
align: 'center',
|
||||
sortable: false,
|
||||
value: 'id',
|
||||
},
|
||||
{
|
||||
text: '썸네일',
|
||||
align: 'center',
|
||||
sortable: false,
|
||||
value: 'image',
|
||||
},
|
||||
{
|
||||
text: '닉네임',
|
||||
align: 'center',
|
||||
sortable: false,
|
||||
value: 'nickname',
|
||||
},
|
||||
{
|
||||
text: '관심사',
|
||||
align: 'center',
|
||||
sortable: false,
|
||||
value: 'tags',
|
||||
},
|
||||
{
|
||||
text: '소개내용',
|
||||
align: 'center',
|
||||
sortable: false,
|
||||
value: 'introduce',
|
||||
},
|
||||
{
|
||||
text: '상담유무',
|
||||
align: 'center',
|
||||
sortable: false,
|
||||
value: 'isCounseling',
|
||||
},
|
||||
{
|
||||
text: '유튜브',
|
||||
align: 'center',
|
||||
sortable: false,
|
||||
value: 'youtubeUrl',
|
||||
},
|
||||
{
|
||||
text: '인스타그램',
|
||||
align: 'center',
|
||||
sortable: false,
|
||||
value: 'instagramUrl',
|
||||
},
|
||||
{
|
||||
text: '관리',
|
||||
align: 'center',
|
||||
sortable: false,
|
||||
value: 'management',
|
||||
},
|
||||
],
|
||||
show_add_counselor_dialog: false,
|
||||
show_introduce_dialog: false,
|
||||
counselor_introduce: null,
|
||||
counselor_nickname: null,
|
||||
}
|
||||
},
|
||||
|
||||
created() {
|
||||
this.getCounselorList()
|
||||
this.getRecommendCounselorList()
|
||||
},
|
||||
|
||||
methods: {
|
||||
notifyError(message) {
|
||||
this.$dialog.notify.error(message)
|
||||
},
|
||||
|
||||
notifySuccess(message) {
|
||||
this.$dialog.notify.success(message)
|
||||
},
|
||||
|
||||
closeIntroduceDialog() {
|
||||
this.show_introduce_dialog = false
|
||||
this.counselor_introduce = null
|
||||
this.counselor_nickname = null
|
||||
},
|
||||
|
||||
showIntroduceDialog(item) {
|
||||
this.counselor_introduce = item.introduce
|
||||
this.counselor_nickname = item.nickname
|
||||
this.show_introduce_dialog = true
|
||||
},
|
||||
|
||||
showAddCounselorDialog() {
|
||||
this.show_add_counselor_dialog = true
|
||||
},
|
||||
|
||||
cancel() {
|
||||
this.counselor_id = null
|
||||
this.show_add_counselor_dialog = false
|
||||
},
|
||||
|
||||
validate() {
|
||||
if (this.counselor_id != null && this.counselor_id > 0) {
|
||||
this.submit()
|
||||
} else {
|
||||
this.notifyError("수다친구를 선택해 주세요.")
|
||||
}
|
||||
},
|
||||
|
||||
async submit() {
|
||||
this.isLoading = true
|
||||
|
||||
try {
|
||||
const res = await api.addRecommendCounselor(this.counselor_id)
|
||||
|
||||
if (res.status === 200 && res.data.success === true) {
|
||||
this.show_add_counselor_dialog = false
|
||||
this.counselor_id = null
|
||||
this.notifySuccess(res.data.message || '등록되었습니다.')
|
||||
await this.getRecommendCounselorList()
|
||||
} else {
|
||||
this.notifyError(res.data.message || '알 수 없는 오류가 발생했습니다. 다시 시도해 주세요.')
|
||||
}
|
||||
} catch (e) {
|
||||
this.notifyError('알 수 없는 오류가 발생했습니다. 다시 시도해 주세요.')
|
||||
} finally {
|
||||
this.isLoading = false
|
||||
}
|
||||
},
|
||||
|
||||
async getCounselorList() {
|
||||
this.isLoading = true
|
||||
|
||||
try {
|
||||
const res = await accountApi.getCounselorList()
|
||||
|
||||
if (res.status === 200 && res.data.success === true) {
|
||||
this.counselorList = res.data.data.map((item) => {
|
||||
return {name: item.nickname, value: item.id}
|
||||
})
|
||||
} else {
|
||||
this.notifyError(res.data.message || '알 수 없는 오류가 발생했습니다. 다시 시도해 주세요.')
|
||||
}
|
||||
} catch (e) {
|
||||
this.notifyError('알 수 없는 오류가 발생했습니다. 다시 시도해 주세요.')
|
||||
} finally {
|
||||
this.isLoading = false
|
||||
}
|
||||
},
|
||||
|
||||
async getRecommendCounselorList() {
|
||||
this.isLoading = true
|
||||
|
||||
try {
|
||||
const res = await api.getRecommendCounselorList()
|
||||
|
||||
if (res.status === 200 && res.data.success === true) {
|
||||
this.recommendCounselorList = res.data.data
|
||||
} else {
|
||||
this.notifyError(res.data.message || '알 수 없는 오류가 발생했습니다. 다시 시도해 주세요.')
|
||||
}
|
||||
} catch (e) {
|
||||
this.notifyError('알 수 없는 오류가 발생했습니다. 다시 시도해 주세요.')
|
||||
} finally {
|
||||
this.isLoading = false
|
||||
}
|
||||
},
|
||||
|
||||
async deleteRecommendCounselor(item) {
|
||||
this.isLoading = true
|
||||
try {
|
||||
const res = await api.deleteRecommendCounselor(item.id)
|
||||
|
||||
if (res.status === 200 && res.data.success === true) {
|
||||
this.notifySuccess(res.data.message || '삭제되었습니다.')
|
||||
await this.getRecommendCounselorList()
|
||||
} else {
|
||||
this.notifyError(res.data.message || '알 수 없는 오류가 발생했습니다. 다시 시도해 주세요.')
|
||||
}
|
||||
} catch (e) {
|
||||
this.notifyError('알 수 없는 오류가 발생했습니다. 다시 시도해 주세요.')
|
||||
} finally {
|
||||
this.isLoading = false
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
td img {
|
||||
display: block;
|
||||
margin: 10px auto;
|
||||
}
|
||||
</style>
|
||||
486
src/views/Promotion/PromotionCreatorSituation.vue
Normal file
486
src/views/Promotion/PromotionCreatorSituation.vue
Normal file
@@ -0,0 +1,486 @@
|
||||
<template>
|
||||
<div>
|
||||
<v-toolbar dark>
|
||||
<v-spacer />
|
||||
<v-toolbar-title>상황별 추천상담사</v-toolbar-title>
|
||||
<v-spacer />
|
||||
</v-toolbar>
|
||||
|
||||
<br>
|
||||
|
||||
<v-row>
|
||||
<v-dialog
|
||||
v-model="show_dialog"
|
||||
max-width="400px"
|
||||
persistent
|
||||
>
|
||||
<template v-slot:activator="{ on, attrs }">
|
||||
<v-container>
|
||||
<v-row>
|
||||
<v-col cols="10" />
|
||||
<v-col>
|
||||
<v-btn
|
||||
block
|
||||
color="#9970ff"
|
||||
dark
|
||||
depressed
|
||||
v-bind="attrs"
|
||||
v-on="on"
|
||||
>
|
||||
상황등록
|
||||
</v-btn>
|
||||
</v-col>
|
||||
</v-row>
|
||||
<v-row>
|
||||
<v-col>
|
||||
<v-data-table
|
||||
:headers="headers"
|
||||
:items="situationList"
|
||||
:loading="isLoading"
|
||||
class="elevation-1"
|
||||
hide-default-footer
|
||||
>
|
||||
<template v-slot:item.image="{ item }">
|
||||
<img
|
||||
:src="item.thumbnailImageUrl"
|
||||
alt=""
|
||||
height="100"
|
||||
width="100"
|
||||
>
|
||||
</template>
|
||||
|
||||
<template v-slot:item.counselor="{ item }">
|
||||
- {{ item.counselorList[0].nickname }}<br>
|
||||
- {{ item.counselorList[1].nickname }}
|
||||
</template>
|
||||
|
||||
<template v-slot:item.isActive="{ item }">
|
||||
<h3 v-if="item.isActive">
|
||||
O
|
||||
</h3>
|
||||
<h3 v-else>
|
||||
X
|
||||
</h3>
|
||||
</template>
|
||||
|
||||
<template v-slot:item.management="{ item }">
|
||||
<v-btn
|
||||
:disabled="isLoading"
|
||||
@click="showModifySituationDialog(item)"
|
||||
>
|
||||
수정
|
||||
</v-btn>
|
||||
|
||||
<v-btn
|
||||
:disabled="isLoading"
|
||||
@click="deleteSituation(item)"
|
||||
>
|
||||
삭제
|
||||
</v-btn>
|
||||
</template>
|
||||
</v-data-table>
|
||||
</v-col>
|
||||
</v-row>
|
||||
</v-container>
|
||||
</template>
|
||||
|
||||
<v-card>
|
||||
<v-card-title>상황 등록</v-card-title>
|
||||
<v-card-text>
|
||||
<v-text-field
|
||||
v-model="title"
|
||||
label="제목"
|
||||
required
|
||||
/>
|
||||
</v-card-text>
|
||||
<v-card-text>
|
||||
<v-row align="center">
|
||||
<v-col cols="4">
|
||||
썸네일
|
||||
</v-col>
|
||||
<v-col cols="8">
|
||||
<div class="image-select">
|
||||
<label for="image">
|
||||
이미지 불러오기
|
||||
</label>
|
||||
<v-file-input
|
||||
id="image"
|
||||
v-model="image"
|
||||
@change="imageAdd"
|
||||
/>
|
||||
</div>
|
||||
<img
|
||||
v-if="image_url"
|
||||
:src="image_url"
|
||||
alt=""
|
||||
class="image-preview"
|
||||
>
|
||||
</v-col>
|
||||
</v-row>
|
||||
</v-card-text>
|
||||
|
||||
<br>
|
||||
|
||||
<v-card-text>
|
||||
<v-row align="center">
|
||||
<v-col cols="4">
|
||||
추천친구
|
||||
</v-col>
|
||||
<v-col cols="8">
|
||||
<v-select
|
||||
v-model="counselor1"
|
||||
:items="counselorList"
|
||||
item-text="name"
|
||||
item-value="value"
|
||||
label="수다친구 선택 1"
|
||||
/>
|
||||
|
||||
<v-select
|
||||
v-model="counselor2"
|
||||
:items="counselorList"
|
||||
item-text="name"
|
||||
item-value="value"
|
||||
label="수다친구 선택 2"
|
||||
/>
|
||||
</v-col>
|
||||
</v-row>
|
||||
</v-card-text>
|
||||
|
||||
<br>
|
||||
|
||||
<v-card-text>
|
||||
<v-row align="center">
|
||||
<v-col cols="4">
|
||||
사용 여부
|
||||
</v-col>
|
||||
<v-col cols="8">
|
||||
<v-radio-group
|
||||
v-model="is_active"
|
||||
row
|
||||
>
|
||||
<v-spacer />
|
||||
<v-radio
|
||||
:value="true"
|
||||
label="사용"
|
||||
/>
|
||||
<v-radio
|
||||
:value="false"
|
||||
label="미사용"
|
||||
/>
|
||||
<v-spacer />
|
||||
</v-radio-group>
|
||||
</v-col>
|
||||
</v-row>
|
||||
</v-card-text>
|
||||
<v-card-actions v-show="!isLoading">
|
||||
<v-spacer />
|
||||
<v-btn
|
||||
color="blue darken-1"
|
||||
text
|
||||
@click="cancel"
|
||||
>
|
||||
취소
|
||||
</v-btn>
|
||||
<v-btn
|
||||
v-if="selected_situation !== null"
|
||||
color="blue darken-1"
|
||||
text
|
||||
@click="modify"
|
||||
>
|
||||
수정
|
||||
</v-btn>
|
||||
<v-btn
|
||||
v-else
|
||||
color="blue darken-1"
|
||||
text
|
||||
@click="validate"
|
||||
>
|
||||
등록
|
||||
</v-btn>
|
||||
</v-card-actions>
|
||||
</v-card>
|
||||
</v-dialog>
|
||||
</v-row>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import * as accountApi from '@/api/member'
|
||||
import * as api from '@/api/counselor_situation'
|
||||
|
||||
export default {
|
||||
name: "PromotionCounselorSituation",
|
||||
|
||||
data() {
|
||||
return {
|
||||
isLoading: false,
|
||||
title: null,
|
||||
image: null,
|
||||
image_url: null,
|
||||
is_active: null,
|
||||
show_dialog: false,
|
||||
selected_situation: null,
|
||||
counselor1: null,
|
||||
counselor2: null,
|
||||
counselorList: [],
|
||||
situationList: [],
|
||||
headers: [
|
||||
{
|
||||
text: '제목',
|
||||
align: 'center',
|
||||
sortable: false,
|
||||
value: 'title',
|
||||
},
|
||||
{
|
||||
text: '썸네일',
|
||||
align: 'center',
|
||||
sortable: false,
|
||||
value: 'image',
|
||||
},
|
||||
{
|
||||
text: '추천친구',
|
||||
align: 'center',
|
||||
sortable: false,
|
||||
value: 'counselor',
|
||||
},
|
||||
{
|
||||
text: '사용여부',
|
||||
align: 'center',
|
||||
sortable: false,
|
||||
value: 'isActive',
|
||||
},
|
||||
{
|
||||
text: '관리',
|
||||
align: 'center',
|
||||
sortable: false,
|
||||
value: 'management'
|
||||
},
|
||||
]
|
||||
}
|
||||
},
|
||||
|
||||
created() {
|
||||
this.getCounselorList()
|
||||
this.getSituationList()
|
||||
},
|
||||
|
||||
methods: {
|
||||
imageAdd(payload) {
|
||||
const file = payload;
|
||||
if (file) {
|
||||
this.image_url = URL.createObjectURL(file)
|
||||
URL.revokeObjectURL(file)
|
||||
} else {
|
||||
this.image_url = null
|
||||
}
|
||||
},
|
||||
|
||||
notifyError(message) {
|
||||
this.$dialog.notify.error(message)
|
||||
},
|
||||
|
||||
notifySuccess(message) {
|
||||
this.$dialog.notify.success(message)
|
||||
},
|
||||
|
||||
cancel() {
|
||||
this.show_dialog = false
|
||||
this.image = null
|
||||
this.image_url = null
|
||||
this.title = null
|
||||
this.selected_situation = null
|
||||
this.is_active = null
|
||||
this.counselor1 = null
|
||||
this.counselor2 = null
|
||||
},
|
||||
|
||||
validate() {
|
||||
if (
|
||||
this.title === null ||
|
||||
this.image === null ||
|
||||
this.is_active === null ||
|
||||
this.counselor2 === null ||
|
||||
this.counselor1 === null
|
||||
) {
|
||||
this.notifyError('내용을 입력하세요')
|
||||
} else if (this.counselor2 === this.counselor1) {
|
||||
this.notifyError('다른 수다친구를 선택해 주세요.')
|
||||
} else {
|
||||
this.submit()
|
||||
}
|
||||
},
|
||||
|
||||
showModifySituationDialog(item) {
|
||||
this.selected_situation = item
|
||||
this.counselor1 = item.counselorList[0].accountId
|
||||
this.counselor2 = item.counselorList[1].accountId
|
||||
this.title = item.title
|
||||
this.image_url = item.thumbnailImageUrl
|
||||
this.is_active = item.isActive
|
||||
|
||||
this.show_dialog = true
|
||||
},
|
||||
|
||||
async submit() {
|
||||
this.isLoading = true
|
||||
|
||||
try {
|
||||
const formData = new FormData()
|
||||
formData.append("image", this.image)
|
||||
formData.append("request", JSON.stringify({
|
||||
title: this.title,
|
||||
isActive: JSON.parse(this.is_active),
|
||||
recommendCounselorIds: [this.counselor1, this.counselor2]
|
||||
}))
|
||||
|
||||
const res = await api.createSituation(formData)
|
||||
|
||||
if (res.status === 200 && res.data.success === true) {
|
||||
this.show_dialog = false
|
||||
this.image = null
|
||||
this.image_url = null
|
||||
this.title = null
|
||||
this.selected_situation = null
|
||||
this.is_active = null
|
||||
this.counselor1 = null
|
||||
this.counselor2 = null
|
||||
|
||||
this.notifySuccess(res.data.message || '등록되었습니다.')
|
||||
} else {
|
||||
this.notifyError(res.data.message || '알 수 없는 오류가 발생했습니다. 다시 시도해 주세요.')
|
||||
}
|
||||
} catch (e) {
|
||||
this.notifyError('알 수 없는 오류가 발생했습니다. 다시 시도해 주세요.')
|
||||
} finally {
|
||||
this.isLoading = false
|
||||
}
|
||||
},
|
||||
|
||||
async modify() {
|
||||
this.isLoading = true
|
||||
|
||||
try {
|
||||
const formData = new FormData()
|
||||
formData.append("image", this.image)
|
||||
formData.append("request", JSON.stringify({
|
||||
title: this.title,
|
||||
isActive: JSON.parse(this.is_active),
|
||||
recommendCounselorIds: [this.counselor1, this.counselor2]
|
||||
}))
|
||||
|
||||
const res = await api.modifySituation(this.selected_situation.id, formData)
|
||||
|
||||
if (res.status === 200 && res.data.success === true) {
|
||||
this.show_dialog = false
|
||||
this.image = null
|
||||
this.image_url = null
|
||||
this.title = null
|
||||
this.selected_situation = null
|
||||
this.is_active = null
|
||||
this.counselor1 = null
|
||||
this.counselor2 = null
|
||||
this.situationList = []
|
||||
this.notifySuccess(res.data.message || '수정되었습니다.')
|
||||
|
||||
await this.getSituationList()
|
||||
} else {
|
||||
this.notifyError(res.data.message || '알 수 없는 오류가 발생했습니다. 다시 시도해 주세요.')
|
||||
}
|
||||
} catch (e) {
|
||||
this.notifyError('알 수 없는 오류가 발생했습니다. 다시 시도해 주세요.')
|
||||
} finally {
|
||||
this.isLoading = false
|
||||
}
|
||||
},
|
||||
|
||||
async deleteSituation(item) {
|
||||
this.isLoading = true
|
||||
try {
|
||||
const res = await api.deleteSituation(item.id)
|
||||
|
||||
if (res.status === 200 && res.data.success === true) {
|
||||
this.notifySuccess(res.data.message || '삭제되었습니다.')
|
||||
await this.getSituationList()
|
||||
} else {
|
||||
this.notifyError(res.data.message || '알 수 없는 오류가 발생했습니다. 다시 시도해 주세요.')
|
||||
}
|
||||
} catch (e) {
|
||||
this.notifyError('알 수 없는 오류가 발생했습니다. 다시 시도해 주세요.')
|
||||
} finally {
|
||||
this.isLoading = false
|
||||
}
|
||||
},
|
||||
|
||||
async getSituationList() {
|
||||
this.isLoading = true
|
||||
|
||||
try {
|
||||
const res = await api.getSituationList();
|
||||
if (res.status === 200 && res.data.success === true) {
|
||||
this.situationList = res.data.data
|
||||
} else {
|
||||
this.notifyError(res.data.message || '알 수 없는 오류가 발생했습니다. 다시 시도해 주세요.')
|
||||
}
|
||||
} catch (e) {
|
||||
this.notifyError('알 수 없는 오류가 발생했습니다. 다시 시도해 주세요.')
|
||||
} finally {
|
||||
this.isLoading = false
|
||||
}
|
||||
},
|
||||
|
||||
async getCounselorList() {
|
||||
this.isLoading = true
|
||||
|
||||
try {
|
||||
const res = await accountApi.getCounselorList()
|
||||
|
||||
if (res.status === 200 && res.data.success === true) {
|
||||
this.counselorList = res.data.data.map((item) => {
|
||||
return {name: item.nickname, value: item.id}
|
||||
})
|
||||
} else {
|
||||
this.notifyError(res.data.message || '알 수 없는 오류가 발생했습니다. 다시 시도해 주세요.')
|
||||
}
|
||||
} catch (e) {
|
||||
this.notifyError('알 수 없는 오류가 발생했습니다. 다시 시도해 주세요.')
|
||||
} finally {
|
||||
this.isLoading = false
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.image-select label {
|
||||
display: inline-block;
|
||||
padding: 10px 20px;
|
||||
background-color: #232d4a;
|
||||
color: #fff;
|
||||
vertical-align: middle;
|
||||
font-size: 15px;
|
||||
cursor: pointer;
|
||||
border-radius: 5px;
|
||||
}
|
||||
|
||||
.v-file-input {
|
||||
position: absolute;
|
||||
width: 0;
|
||||
height: 0;
|
||||
padding: 0;
|
||||
overflow: hidden;
|
||||
border: 0;
|
||||
}
|
||||
|
||||
.image-preview {
|
||||
max-width: 100%;
|
||||
width: 250px;
|
||||
object-fit: cover;
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
td img {
|
||||
display: block;
|
||||
margin: 10px auto;
|
||||
}
|
||||
</style>
|
||||
173
src/views/Promotion/Push.vue
Normal file
173
src/views/Promotion/Push.vue
Normal file
@@ -0,0 +1,173 @@
|
||||
<template>
|
||||
<div>
|
||||
<v-toolbar dark>
|
||||
<v-spacer />
|
||||
<v-toolbar-title>푸시메시지 발송</v-toolbar-title>
|
||||
<v-spacer />
|
||||
</v-toolbar>
|
||||
|
||||
<br>
|
||||
|
||||
<v-container>
|
||||
<v-text-field
|
||||
v-model="account_id"
|
||||
label="회원번호(입력하지 않으면 전체회원에게 발송)"
|
||||
outlined
|
||||
required
|
||||
/>
|
||||
|
||||
<v-text-field
|
||||
v-model="title"
|
||||
label="제목"
|
||||
outlined
|
||||
required
|
||||
/>
|
||||
|
||||
<v-textarea
|
||||
v-model="message"
|
||||
label="내용"
|
||||
outlined
|
||||
required
|
||||
/>
|
||||
|
||||
<v-row>
|
||||
<v-col cols="10" />
|
||||
<v-col>
|
||||
<v-btn
|
||||
block
|
||||
color="#9970ff"
|
||||
dark
|
||||
depressed
|
||||
@click="confirm"
|
||||
>
|
||||
메시지 발송
|
||||
</v-btn>
|
||||
</v-col>
|
||||
</v-row>
|
||||
|
||||
<v-row>
|
||||
<v-dialog
|
||||
v-model="show_confirm"
|
||||
max-width="400px"
|
||||
persistent
|
||||
>
|
||||
<v-card>
|
||||
<v-card-title>푸시메시지 발송 확인</v-card-title>
|
||||
<v-card-text v-if="account_id.length > 0">
|
||||
발송대상(회원번호): {{ send_account_id }}
|
||||
</v-card-text>
|
||||
<v-card-text v-else>
|
||||
발송대상(회원번호): 전체
|
||||
</v-card-text>
|
||||
<v-card-text>
|
||||
제목: {{ title }}
|
||||
</v-card-text>
|
||||
<v-card-text>
|
||||
내용: {{ message }}
|
||||
</v-card-text>
|
||||
<v-card-actions v-show="!isLoading">
|
||||
<v-spacer />
|
||||
<v-btn
|
||||
color="blue darken-1"
|
||||
text
|
||||
@click="send"
|
||||
>
|
||||
발송
|
||||
</v-btn>
|
||||
<v-spacer />
|
||||
<v-btn
|
||||
color="blue darken-1"
|
||||
text
|
||||
@click="cancel"
|
||||
>
|
||||
취소
|
||||
</v-btn>
|
||||
<v-spacer />
|
||||
</v-card-actions>
|
||||
</v-card>
|
||||
</v-dialog>
|
||||
</v-row>
|
||||
</v-container>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import * as api from '@/api/push'
|
||||
|
||||
export default {
|
||||
name: "Push",
|
||||
|
||||
data() {
|
||||
return {
|
||||
show_confirm: false,
|
||||
isLoading: false,
|
||||
account_id: '',
|
||||
send_account_id: [],
|
||||
title: '',
|
||||
message: ''
|
||||
}
|
||||
},
|
||||
|
||||
methods: {
|
||||
notifyError(message) {
|
||||
this.$dialog.notify.error(message)
|
||||
},
|
||||
|
||||
notifySuccess(message) {
|
||||
this.$dialog.notify.success(message)
|
||||
},
|
||||
|
||||
confirm() {
|
||||
if (this.title.trim() === '') {
|
||||
return this.notifyError('제목을 입력하세요')
|
||||
}
|
||||
|
||||
if (this.message.trim() === '') {
|
||||
return this.notifyError('내용을 입력하세요')
|
||||
}
|
||||
|
||||
if (!this.isLoading) {
|
||||
if (this.account_id.length > 0) {
|
||||
this.send_account_id = Array.from(
|
||||
new Set(
|
||||
this.account_id.split(",")
|
||||
.map(accountId => accountId.trim())
|
||||
.filter(accountId => Number(accountId))
|
||||
)
|
||||
)
|
||||
}
|
||||
this.show_confirm = true
|
||||
}
|
||||
},
|
||||
|
||||
cancel() {
|
||||
this.show_confirm = false
|
||||
},
|
||||
|
||||
async send() {
|
||||
if (!this.isLoading) {
|
||||
this.isLoading = true
|
||||
|
||||
try {
|
||||
await api.sendPush(
|
||||
this.send_account_id,
|
||||
this.title,
|
||||
this.message
|
||||
)
|
||||
} finally {
|
||||
this.isLoading = false
|
||||
this.show_confirm = false
|
||||
this.account_id = ''
|
||||
this.send_account_id = []
|
||||
this.title = ''
|
||||
this.message = ''
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
Reference in New Issue
Block a user