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="content">
<div class="sub-title-area mb-30">
<h2>보도자료</h2>
<div class="breadcrumb-list">
<ul>
<li>
<img :src="homeicon" alt="Home Icon">
<p>언론에서 바라본 구미시</p>
</li>
<li><img :src="righticon" alt=""></li>
<li>보도자료</li>
</ul>
</div>
</div>
<form class="gallery-form mb-40" @submit.prevent>
<dl class="mb-60">
<dd>
<p>{{ findResult.sj }}</p>
<div class="date flex align-center">
<img :src="calendaricon" alt="">
<span>{{ $dotFormatDate(findResult.rgsde) }}</span>
</div>
</dd>
</dl>
<div class="flex-sp-bw mb-50">
<div class="img-box">
<img v-if="findResult.hasOwnProperty('files') && findResult.files.length > 0" :src="findResult.files[0].filePath" :alt="썸네일" style="max-width: 100%" />
<img v-else :src="noimg" :alt="썸네일" />
</div>
<form class="info-form wfull" @submit.prevent>
<div class="info-box">
<h3>기본정보</h3>
<dl>
<dd class="mb-20">
<img :src="addressicon" alt="">
<span>링크</span>
<p>{{ findResult.link }}</p>
</dd>
<dd class="mb-20">
<img :src="yearicon" alt="">
<span>생산연도</span>
<p>{{ $dotFormatDate(findResult.prdctnYear) }}</p>
</dd>
<dd>
<img :src="categoryicon" alt="">
<span>카테고리</span>
<ul class="category">
<li v-for="(item, idx) of findResult.ctgrys" :key="idx" class="category">{{ item.ctgryNm }}</li>
</ul>
</dd>
</dl>
</div>
</form>
</div>
</form>
<h3>내용</h3>
<form class="info-form mb-50" @submit.prevent>
<dl>
<dd>
<ViewerComponent :content="findResult.cn" />
</dd>
</dl>
</form>
<div class="btn-group flex-center">
<button class="red-line " type="button" @click="fnDelete">삭제</button>
<button class="blue-line " type="button" @click="fnMoveTo('edit', pageId)">수정</button>
<button class="gray-line-bg " type="button" @click="fnMoveTo('list')">목록</button>
</div>
</div>
</template>
<script>
// COMPONENT
import ViewerComponent from '@/views/component/editor/ViewerComponent.vue';
// API
import { findNesDtaProc, deleteNesDtaProc } from '@/resources/api/nesDta';
export default {
components: {
ViewerComponent,
},
data() {
return {
// ICON
noimg: "client/resources/images/no_img.png",
calendaricon: 'client/resources/images/icon/calendaricon.png',
homeicon: 'client/resources/images/icon/home.png',
erroricon: 'client/resources/images/icon/error.png',
righticon: 'client/resources/images/icon/right.png',
addressicon: 'client/resources/images/icon/addressicon.png',
yearicon: 'client/resources/images/icon/yearicon.png',
categoryicon: 'client/resources/images/icon/categoryicon.png',
pageId: null,
findResult: {},
selectedFiles: [],
};
},
created() {
this.pageId = this.$route.query.id;
if (this.$isEmpty(this.pageId)) {
alert("게시물 존재하지 않습니다.");
this.fnMoveTo('list');
}
},
mounted() {
this.fnFindNesDta(); // 상세 조회
},
methods: {
// 상세 조회
async fnFindNesDta() {
try {
const response = await findNesDtaProc(this.pageId);
this.findResult = response.data.data.nesDta;
} catch (error) {
alert('조회중 오류가 발생했습니다.');
if (error.response) {
alert(error.response.data.message);
}
console.error(error.message);
this.fnMoveTo('list');
}
},
// 삭제
async fnDelete() {
let isCheck = confirm("해당 페이지를 삭제하시겠습니까?");
if (!isCheck) {
return;
}
try {
const response = await deleteNesDtaProc(this.pageId);
alert('해당 페이지를 삭제했습니다.');
this.fnMoveTo('list'); // 목록으로 이동
} catch (error) {
if (error.response) {
alert(error.response.data.message);
}
console.error(error.message);
}
},
// 페이지 이동
fnMoveTo(type, id) {
const routes = {
'list': { name: 'NewsReleaseSearch' },
'view': { name: 'NewsReleaseDetail', query: { id } },
'edit': { name: 'NewsReleaseInsert', query: this.$isEmpty(id) ? {} : { id } },
};
if (routes[type]) {
this.$router.push(routes[type]);
} else {
alert("올바르지 않은 경로를 요청하여 목록으로 이동합니다.");
this.$router.push(routes['list']);
}
},
},
};
</script>