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>
<div class="form-card" style="margin-bottom: 20px;">
<h1>출장품의서</h1>
<SanctnViewList v-if="bsrpCnsul.sanctnList.length > 0" :sanctns="bsrpCnsul.sanctnList" />
<form class="row g-3 needs-validation detail" :class="{ 'was-validated': formSubmitted }" @submit.prevent="handleRegister" novalidate>
<div class="col-12">
<div class="col-12 border-x">
<label class="form-label">출장구분</label>
<p>{{ bsrpInfo.bsrpSeNm }}</p>
</div>
<div class="col-12 border-x">
<label class="form-label">이름</label>
<p>{{ user.userNm }}</p>
</div>
</div>
<div class="col-12">
<div class="col-12 border-x">
<label class="form-label">부서</label>
<p>{{ user.deptNm }}</p>
</div>
<div class="col-12 border-x">
<label class="form-label">직급</label>
<p>{{ user.clsfNm }}</p>
</div>
</div>
<div class="col-12">
<label class="form-label">출장지</label>
<p>{{ bsrpInfo.bsrpPlace }}</p>
</div>
<div class="col-12">
<label class="form-label">출장목적</label>
<p>{{ bsrpInfo.bsrpPurps }}</p>
</div>
<div class="col-12">
<label class="form-label">동행자</label>
<div v-if="bsrpInfo.bsrpNmprList.length > 0">
<span v-for="(item, idx) of bsrpInfo.bsrpNmprList" :key="idx">{{ item.triperNm }}</span>
</div>
</div>
<div class="col-12">
<label class="form-label">품의내용</label>
<ViewerComponent :content="bsrpCnsul.cn" />
</div>
<div class="col-12">
<label class="form-label">법인카드</label>
<div>
<p v-for="(item, idx) of cprCardList" :key="idx">
<span v-if="idx !== 0">, </span>
<span>{{ item.cardNm }}</span>
</p>
</div>
</div>
<div class="col-12">
<label class="form-label">법인차량</label>
<div>
<p v-for="(item, idx) of cprVhcleList" :key="idx">
<span v-if="idx !== 0">, </span>
<span>{{ item.vhcleNm }}</span>
</p>
</div>
</div>
<div class="col-12 border-x">
<label class="form-label">품의 신청일</label>
<p>{{ bsrpCnsul.rgsde }}</p>
</div>
</form>
</div>
<div v-if="!$isEmpty(bsrpRport.bsrpId)" class="form-card">
<h1>출장복명서</h1>
<SanctnViewList v-if="bsrpRport.sanctnList.length > 0" :sanctns="bsrpRport.sanctnList" />
<form class="row g-3 needs-validation detail" :class="{ 'was-validated': formSubmitted }" @submit.prevent="handleRegister" novalidate>
<div class="col-12">
<label class="form-label">복명내용</label>
<ViewerComponent :content="bsrpRport.cn" />
</div>
<div class="col-12">
<label class="form-label">여비계산</label>
<p>{{ bsrpInfo.applcntId }}</p>
</div>
<div class="col-12">
<label class="form-label">복명 신청일</label>
<p>{{ bsrpRport.rgsde }}</p>
</div>
<div class="col-12 border-x return">
<label class="form-label">반려사유</label>
<p>{{ bsrpInfo.applcntId }}</p>
</div>
</form>
</div>
<div class="buttons">
<button v-if="sanctnStatus === 'waiting' && sanctnStatus !== 'approved'" type="button" class="btn btn-red" @click="deleteData">신청취소</button>
<button v-if="sanctnStatus === 'waiting'" type="button" class="btn secondary" @click="fnMoveTo('edit', pageId)">수정</button>
<button v-if="sanctnStatus === 'rejected'" type="button" class="btn secondary" @click="fnMoveTo('edit', pageId)">재신청</button>
<button v-if="sanctnStatus === 'approved'" type="button" class="btn primary" @click="fnMoveTo('plus', pageId)">복명서 작성</button>
<button type="button" class="btn tertiary" @click="fnMoveTo('list')">목록</button>
</div>
</div>
</div>
</template>
<script>
import SanctnViewList from '../../../component/Sanctn/SanctnViewList.vue';
import ViewerComponent from '../../../component/editor/ViewerComponent.vue';
// API
import { bsrpProc, deleteBsrpProc } from '../../../../resources/api/bsrp';
export default {
components: {
SanctnViewList, ViewerComponent,
},
data() {
return {
pageId: null,
// 출장 정보
bsrpInfo: {
bsrpId: null, // 출장 아이디
applcntId: null, // 신청자 아이디
bsrpSe: null, // 출장구분 (공통코드 : sanctn_mby_bsrp)
bsrpPlace: null, // 출장지
bsrpPurps: null, // 출장목적
bgnde: null, // 시작일
beginHour: null, // 시작시
beginMnt: null, // 시작분
endde: null, // 종료일
endHour: null, // 종료시
endMnt: null, // 종료분
bsrpSeNm: null, // 출장구분 이름
bsrpNmprList: [], // 출장 인원
},
// 품의서
bsrpCnsul: {
bsrpId: null, // 출장 아이디
cn: null, // 내용
confmAt: null, // 승인 여부 (W: 대기, A: 승인, R 반려)
rgsde: null, // 등록일
register: null, // 등록자
updde: null, // 수정일
updusr: null, // 수정자
sanctnList: [],
},
// 복명서
bsrpRport: {
bsrpId: null, // 출장 아이디
cn: null, // 내용
confmAt: null, // 승인 여부 (W: 대기, A: 승인, R 반려)
fileId: null, // 파일 아이디
rgsde: null, // 등록일
register: null, // 등록자
updde: null, // 수정일
updusr: null, // 수정자
sanctnList: [],
},
// 신청자 정보
user: {},
};
},
computed: {
// 결재 상태 확인
sanctnStatus() {
const sanctnList = this.bsrpCnsul.sanctnList;
if (sanctnList.length === 0) return 'none'; // 결재 정보 없음
// 하나라도 반려가 있으면 '반려'
if (sanctnList.some(item => item.sanctnSttus === 'R')) {
return 'rejected';
}
// 모든 결재가 승인이면 '승인'
if (sanctnList.every(item => item.sanctnSttus === 'A')) {
return 'approved';
}
// 그 외에는 '대기'
return 'waiting';
}
},
async created() {
this.pageId = this.$route.query.id;
if (this.$isEmpty(this.pageId)) {
alert("게시물이 존재하지 않습니다.");
this.fnMoveTo('list');
}
},
mounted() {
this.findDatas(); // 상세 조회
},
methods: {
// 상세 조회
async findDatas() {
try {
const response = await bsrpProc(this.pageId);
const result = response.data.data;
this.bsrpInfo = result.bsrpInfo;
this.bsrpInfo.bgnde = this.bsrpInfo.bgnde.split(' ')[0];
this.bsrpInfo.endde = this.bsrpInfo.endde.split(' ')[0];
this.cprCardList = result.cprCardList;
this.cprVhcleList = result.cprVhcleList;
this.user = result.user;
this.bsrpCnsul = result.bsrpCnsul;
this.bsrpRport = result.bsrpRport;
} catch (error) {
const message = error.response.data.message;
alert(message);
}
},
// 삭제
async deleteData() {
const isCheck = confirm("삭제하시겠습니까?");
if (!isCheck) {
return;
}
try {
const response = await deleteBsrpProc(this.pageId);
this.fnMoveTo('list');
} catch (error) {
if (error.response) {
alert(error.response.data.message);
} else {
alert("에러가 발생했습니다.");
}
console.error(error.message);
this.fnMoveTo('list');
}
},
// 페이지 이동
fnMoveTo(type, id) {
const routes = {
'list': { name: 'ChuljangStatue' },
'view': { name: 'ChuljangDetailAll', query: { id } },
'edit': { name: 'ChuljangInsert', query: this.$isEmpty(id) ? {} : { id } },
'plus': { name: 'ChuljangInsert', query: this.$isEmpty(id) ? {} : { id } },
};
if (routes[type]) {
if (!this.$isEmpty(this.pageId) && type === 'list') {
this.$router.push({ name: 'ChuljangDetailAll', query: { id: this.pageId } });
}
this.$router.push(routes[type]);
} else {
alert("올바르지 않은 경로를 요청하여 목록으로 이동합니다.");
this.$router.push(routes['list']);
}
},
},
};
</script>