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="news-wrap">
<div class="content-box">
<div class="title-wrap">
<div class="flex-start">
<img src="../../../../resources/jpg/info-logo.png" alt="홍보뉴스 아이콘" class="title-icon">
<h2 class="main-title">홍보 / news</h2>
</div>
</div>
<div class="content-wrap NewsSelectList">
<div class="btn-wrap">
<div class="data-select">
<select v-model="postListSearch.searchType" name="data-table-sild" id="data-table-sild"
class="data-table-search">
<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="postListSearch.searchText" @keyup.enter="postSelectList()">
<input class="button--submit" value="검색" type="submit" @click="postSelectList()">
</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>
<ul class="news-list">
<li v-for="(item, idx) in postList" :key="idx" @click.stop="postSelectOnePage(item)">
<a>
<div class="thumbnail">
<img :src="'http://211.253.8.180:8082' + item.file_path + '/' + item.file_nm + '.' + item.file_extn_nm"
alt="thumbnail" />
</div>
<div class="text-zone">
<p class="content-title">{{ item.post_title }}</p>
<p class="content-detail">{{ removeTag(item.post_content) }}</p>
<div class="content-info">
<p><span class="writer">작성자</span><span>{{ item.rgtr_id }}</span></p>
<p><span class="views">조회수</span><span>{{ item.view_cnt }}</span></p>
</div>
<p class="content-date">{{ yyyymmdd(item.reg_dt) }}</p>
</div>
</a>
</li>
</ul>
<div class="btn-wrap">
<button class="blue-btn" @click="postInsertPage()">글쓰기</button>
</div>
<div class="bottom-wrap">
<PaginationButton v-model:currentPage="postListSearch.currentPage" :perPage="postListSearch.perPage"
:totalCount="postListCount" :maxRange="5" :click="postSelectList" />
</div>
</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 {
postListSearch: {
currentPage: 1,
perPage: 10,
searchType: 'all',
searchText: null,
bbs_id: '1',
sort: 'dt'
},
postList: [],
postListCount: 0,
postIdx: 0,
// 최신순 조회순
sorts: [ { name: '최신순', value: 'dt'},
{ name: '조회수순', value: 'view'}],
activeIndex: 0,
option: [
{ name: '전체', value: 'all'},
{ name: '제목', value: 'title'},
{ name: '내용', value: 'content'},
{ name: '작성자', value: 'writer'},
]
};
},
methods: {
// 최신순 조회순
changeColor(index) {
this.activeIndex = index;
this.postListSearch.sort = this.sorts[index].value;
this.postSelectList();
},
postSelectList: function () {
const vm = this;
axios({
// url: '/post/postSelectList.json',
url: '/post/newsSelectList.json',
method: 'post',
hearder: {
'Content-Type': "application/json; charset=UTF-8",
},
data: vm.postListSearch
}).then(function (response) {
vm.postList = response.data.postSelectList;
vm.postListCount = response.data.postSelectListCount;
vm.postIdx = vm.postListCount - (vm.postListSearch.currentPage - 1) * vm.postListSearch.perPage;
}).catch(function (error) {
alert('홍보/뉴스 목록 조회 오류, 관리자에게 문의하세요.');
})
},
//날짜 시,분,초 자르기
yyyymmdd: function (date) {
return COMMON_UTIL.yyyymmdd(date);
},
// content html 제거
removeTag: function (data) {
return COMMON_UTIL.removeTag(data);
},
//게시글 상세조회 페이지로 이동
postSelectOnePage: function (item) {
this.$router.push({ path: '/adm/newsSelectOne.page', query: { 'post_id': item.post_id, 'file_id': item.file_id, 'bbs_id': item.bbs_id } });
},
postInsertPage: function () {
this.$router.push({ path: '/adm/newsInsert.page', query: {} })
}
},
watch: {},
computed: {},
components: {
PaginationButton: PaginationButton,
},
mounted() {
this.postSelectList();
}
};
</script>