
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="card">
<div class="card-body">
<h2 class="card-title">공통코드 상세</h2>
<p class="require">* 필수입력</p>
<div class="tbl-wrap">
<table class="tbl data radius-table">
<colgroup>
<col style="width: 25%;">
<col style="width: 25%;">
<col style="width: 25%;">
<col style="width: 25%;">
</colgroup>
<tbody>
<tr>
<th>상위코드</th>
<td>{{ codeDetail.upperCode }}</td>
<th>상위코드 명</th>
<td>{{ codeDetail.upperCodeNm }}</td>
</tr>
<tr>
<th>코드</th>
<td>{{ codeDetail.code }}</td>
<th>코드명</th>
<td>{{ codeDetail.codeNm }}</td>
</tr>
<tr>
<th>코드 설정값</th>
<td colspan="3">{{ codeDetail.codeValue }}</td>
</tr>
<tr>
<th>설명</th>
<td colspan="3">
<p>{{ codeDetail.dc }}</p>
</td>
</tr>
<tr>
<th>사용여부</th>
<td colspan="3">{{ getActiveStatusText(codeDetail.useAt) }}</td>
</tr>
</tbody>
</table>
</div>
<div class="buttons">
<button type="button" class="btn sm secondary" v-if="codeDetail.useAt === 'Y'" @click="handleStatusUpdate('N')"> 삭제 </button>
<button type="button" class="btn sm secondary" v-if="codeDetail.useAt === 'N'" @click="handleStatusUpdate('Y')"> 복구 </button>
<button type="button" class="btn sm primary" @click="handleNavigation('edit', pageId)"> 수정 </button>
<button type="button" class="btn sm tertiary" @click="handleNavigation('list')"> 목록 </button>
</div>
</div>
</div>
</template>
<script>
// API
import { findCodeProc, updateCodeProc } from "../../../../resources/api/code";
export default {
name: 'CodeDetailPage',
data() {
return {
pageId: null,
codeDetail: {
code: null,
codeNm: null,
upperCode: null,
upperCodeNm: null,
dc: null,
useAt: 'Y',
codeValue: null,
}
}
},
created() {
this.pageId = this.$route.query.id;
if (this.$isEmpty(this.pageId)) {
alert("게시물이 존재하지 않습니다.");
this.handleNavigation('list');
}
},
mounted() {
this.fetchCodeDetail();
},
methods: {
// 상세 정보 조회
async fetchCodeDetail() {
try {
const response = await findCodeProc(this.pageId);
const result = response.data.data;
this.codeDetail = result.code;
} catch (error) {
this.handleError(error);
}
},
// 사용상태 업데이트 (삭제/복구)
async handleStatusUpdate(status) {
try {
if (status === "N") {
const isConfirmed = confirm("삭제하시겠습니까?");
if (!isConfirmed) return;
}
const updateData = {
codeNm: this.codeDetail.codeNm,
useAt: status,
};
const response = await updateCodeProc(this.pageId, updateData);
const result = response.data.data;
this.codeDetail = result.code;
const message = status === "Y" ? "복구에 성공했습니다." : "삭제에 성공했습니다.";
alert(message);
this.fetchCodeDetail();
} catch (error) {
this.handleError(error);
}
},
// 사용여부 텍스트 반환
getActiveStatusText(useAt) {
return useAt === 'Y' ? "사용중" : "미사용";
},
// 페이지 이동
handleNavigation(type, id) {
const routeMap = {
'list': { name: 'CodeManagementListPage' },
'view': { name: 'CodeManagementViewPage', query: { id } },
'edit': { name: 'CodeManagementInsertPage', query: this.$isEmpty(id) ? {} : { id } },
};
const route = routeMap[type];
if (route) {
this.$router.push(route);
} else {
this.handleNavigationError(type);
}
},
// 네비게이션 에러 처리
handleNavigationError(type) {
console.warn(`유효하지 않은 라우트 타입: ${type}`);
alert("올바르지 않은 경로를 요청하여 목록으로 이동합니다.");
this.$router.push({ name: 'CodeManagementListPage' });
},
// 에러 처리
handleError(error) {
const message = error.response?.data?.message || "에러가 발생했습니다.";
alert(message);
console.error(error.message);
}
}
}
</script>