File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
<template>
<div class="notice-wrap">
<div class="content-box">
<div class="title-wrap">
<div class="flex-start">
<img src="../../../../resources/jpg/popup.png" alt="팝업 아이콘" class="title-icon">
<h2 class="main-title">팝업관리</h2>
</div>
</div>
<div class="content-wrap NoticeSelectList">
<div class="btn-wrap">
<div class="data-select">
<select v-model="popupListSearch.searchType" name="data-table-sild" id="data-table-sild">
<!-- <option :value=null selected>전체</option>
<option value="title">제목</option>
<option value="user">작성자</option>
<option value="조회순">조회순</option> -->
<option v-for="(item, idx) in option" :key="idx" :value=item.value>
{{ item.name }}
</option>
</select>
<div class="input-group">
<input type="text" class="input" placeholder="검색어를 입력해주세요."
v-model="popupListSearch.searchText" @keyup.enter="popupSelectList()">
<input class="button--submit" value="검색" type="submit" @click="popupSelectList()">
</div>
</div>
</div>
<div class="sort-wrap" style="grid-column: 1 / span 2;">
<ul class="flex-end">
<li v-for="(item, index) in sorts" :key="index" :class="{ active: activeIndex === index }"
@click="changeColor(index)">
{{ item.name }}
</li>
</ul>
</div>
<table class="select-table">
<colgroup>
<col style="width:10%"/>
<col style="width:27%"/>
<col style="width:10%"/>
<col style="width:10%"/>
<col style="width:20%"/>
<col style="width:7%"/>
<col style="width:16%"/>
</colgroup>
<thead>
<tr>
<th>no</th>
<th>제목</th>
<th>작성자</th>
<th>등록일</th>
<th>게시기간</th>
<th>공지여부</th>
<th>기능</th>
</tr>
</thead>
<tbody>
<tr v-for="(item, idx) in popupList" :key="idx" @click="popupSelectOnePage(item)">
<td>{{ popupIdx - idx }}</td>
<td><p class="popup-title">{{ item.popup_title }}</p></td>
<td>{{ item.rgtr_id }}</td>
<td>{{ yyyymmdd(item.reg_dt) }}</td>
<td>{{ item.start_dt }} ~ {{ item.end_dt }}</td>
<td>{{ item.notice_yn == 'Y' ? "Y" : "N" }}</td>
<td><button class="blue-btn" @click.stop="popupUpdatePage(item)">수정</button><button class="red-btn" @click.stop="popupDelete(item)">삭제</button></td>
</tr>
<tr v-if="popupListCount == 0">
<td style="font-size: 20px;" colspan="7">검색조건에 해당하는 데이터가 없습니다.</td>
</tr>
</tbody>
</table>
<div class="btn-wrap">
<button class="blue-btn" @click="popupInsertPage()">글쓰기</button>
</div>
</div>
<div class="bottom-wrap">
<PaginationButton v-model:currentPage="popupListSearch.currentPage" :perPage="popupListSearch.perPage"
:totalCount="popupListCount" :maxRange="5" :click="popupSelectList" />
</div>
</div>
</div>
</template>
<script>
import axios from 'axios';
import COMMON_UTIL from '../../../../resources/js/commonUtil.js';
import PaginationButton from '../../../component/pagination/PaginationButton.vue';
export default {
data() {
return {
popupListSearch: {
currentPage: 1,
perPage: 10,
searchType: 'all',
searchText: null,
sort: 'desc'
},
popupListCount: 0,
popupIdx: 0,
popupList: [],
// 최신순 조회순
sorts: [{ name: '최신순', value: 'desc' },
{ name: '등록순', value: 'asc' }],
activeIndex:0,
option: [
{ name: '전체', value: 'all'},
{ name: '제목', value: 'title'},
{ name: '작성자', value: 'writer'},
]
};
},
methods: {
changeColor(index) {
this.activeIndex = index;
this.popupListSearch.sort = this.sorts[index].value;
this.popupSelectList();
},
//날짜 시,분,초 자르기
yyyymmdd: function (date) {
return COMMON_UTIL.yyyymmdd(date);
},
//게시글 상세조회 페이지로 이동
popupSelectOnePage: function (item) {
this.$router.push({ path: '/adm/popupSelectOne.page', query: { "post_id" : item.post_id, "file_id": item.file_id } });
},
popupInsertPage: function () {
this.$router.push({ path: '/adm/popupInsert.page', query: {} })
},
popupUpdatePage: function (item) {
this.$router.push({ path: '/adm/popupUpdate.page', query: { 'post_id': item.post_id, 'file_id': item.file_id } });
},
popupSelectList: function () {
const vm = this;
axios({
url: '/popup/popupSelectList.json',
method: 'post',
hearder: {
'Content-Type': "application/json; charset=UTF-8",
},
data: vm.popupListSearch
}).then(function (response) {
vm.popupList = response.data.popupSelectList;
vm.popupListCount = response.data.popupSelectListCount;
vm.popupIdx = vm.popupListCount - (vm.popupListSearch.currentPage - 1) * vm.popupListSearch.perPage;
}).catch(function (error) {
alert('팝업 목록 조회 오류, 관리자에게 문의하세요.');
})
},
popupDelete: function (item) {
if(!confirm("해당 팝업을 삭제하시겠습니까?")){
return;
}
const vm = this;
axios({
url: "/popup/popupDelete.json",
method: "post",
headers: {
"Content-Type": "application/json; charset=UTF-8",
},
data: item
}).then(function (response) {
let result = response.data;
if (result > 0) {
alert("삭제가 완료 되었습니다.");
vm.popupSelectListPage();
} else {
alert("삭제실패, 다시 시도 해주세요.");
}
}).catch(function (error) {
console.log("postDelete - error : ", error);
alert("삭제 오류, 관리자에게 문의해주세요.");
});
},
},
watch: {},
computed: {},
components: {
PaginationButton: PaginationButton,
},
mounted() {
this.popupSelectList();
}
};
</script>