File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
04-04
File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
<template>
<div class="content-zone full-page">
<div class="content">
<div class="setting-box h_100">
<div class="node-zone">
<div class="tree">
<draggable tag="ul" class="tree-node" :list="codeList" :group="{ name: 'menu' }" item-key="id"
handle=".handle" ghost-class="ghost">
<template #item="{ element }">
<Hierachy :tasks="element" :icon="iconPath" :selectedNode="selectedCd"
@changeSelected="fnViewDetail" />
</template>
</draggable>
</div>
<div class="btn-zone">
<template v-if="pageAuth.mdfcnAuthrt == 'Y'">
<button class="btn top sm secondary" @click="topAdd">
TOP+
</button>
<button class="btn sub sm secondary" @click="subAdd">
SUB+
</button>
<button class="btn save sm" @click="fnListUpdate">
저장
</button>
</template>
</div>
</div>
<div class="setting-zone">
<div class="form-box sch-full">
<div class="form-box-title">
<p>공통코드정보</p>
<p><span>*</span>필수입력</p>
</div>
<div class="form-content" style="grid-template-rows: auto auto auto 1fr;">
<div class="layout">
<label for="" class="form-title">상위코드</label>
<input type="text" class="form-control sm" disabled v-model="viewCode.upCd" />
</div>
<div class="layout">
<label for="" class="form-title">상위코드명</label>
<input type="text" class="form-control sm" disabled v-model="viewCode.upCdNm" />
</div>
<div class="layout">
<label for="" class="form-title"><span>*</span>코드</label>
<input type="text" class="form-control sm" :disabled="isFormDisabled || !submitStts"
v-model="viewCode.cd" placeholder="코드를 입력하세요."/>
</div>
<div class="layout">
<label for="" class="form-title"><span>*</span>코드명</label>
<input type="text" class="form-control sm" :disabled="isFormDisabled" v-model="viewCode.cdNm" placeholder="코드명을 입력하세요."/>
</div>
<div class="layout">
<label for="" class="form-title">코드값</label>
<input type="text" class="form-control sm" :disabled="isFormDisabled" v-model="viewCode.cdVl" placeholder="코드값을 입력해주세요."/>
</div>
<div class="border-bottom layout">
<label for="" class="form-title"><span>*</span>사용여부</label>
<div class="check-area">
<div class="form-check">
<input type="radio" name="code" id="y" value="Y" :disabled="isFormDisabled"
v-model="viewCode.useYn" />
<label for="y">사용</label>
</div>
<div class="form-check">
<input type="radio" name="code" id="n" value="N" :disabled="isFormDisabled"
v-model="viewCode.useYn" />
<label for="n">미사용</label>
</div>
</div>
</div>
<div class="grid-column layout">
<label for="textarea" class="form-title" style="vertical-align: top;">코드설명</label>
<textarea class="form-control sm" id="textarea" :disabled="isFormDisabled" v-model="viewCode.cdExpln" style="height: 100%;" placeholder="코드설명을 입력해주세요."></textarea>
</div>
</div>
</div>
<div class="btn-wrap">
<button class="btn sm main" :disabled="isFormDisabled" @click="fnSave"
v-if="pageAuth.regAuthrt == 'Y'">
<span v-if="submitStts">등록</span>
<span v-else>수정</span>
</button>
<button :class="{
'btn sm': true,
'red': !isFormDisabled,
}" :disabled="isFormDisabled" @click="fnDel" v-if="pageAuth.delAuthrt == 'Y' && originCode.cd != null">
삭제
</button>
</div>
</div>
</div>
</div>
</div>
</template>
<script>
import _ from "lodash";
import draggable from "vuedraggable";
import Hierachy from "../../../../component/hierachy/HierachyDraggable.vue";
import {
findAll,
findByCd,
save,
update,
del,
updateListProc,
} from "../../../../../resources/api/codeManage";
export default {
components: {
draggable: draggable,
Hierachy: Hierachy,
},
data() {
return {
// 페이지 권한 객체
pageAuth: JSON.parse(localStorage.getItem("vuex")).pageAuth,
codeList: [], // 코드 목록
iconPath: 'ico_folder_3d',
selectedCd: null, // 선택된 코드
newCode: {}, // 신규 코드 등록
viewCode: {cd: null}, // 사용자에게 보여질 코드
originCode: {cd: null}, // 변경전 코드
submitStts: true,
};
},
created() {
this.findAll();
},
methods: {
// 목록 조회
async findAll() {
try {
const res = await findAll();
if (res.status == 200) {
this.codeList = res.data.data.hierachyList;
if(this.codeList.length > 0 && this.selectedCd == null) {
this.fnViewDetail(this.codeList[0].id);
}
this.newCode = res.data.data.newCode;
this.newCode.useYn = "Y";
}
} catch (error) {
const errorData = error.response.data;
if (errorData.message != null && errorData.message != "") {
alert(error.response.data.message);
} else {
alert("에러가 발생했습니다.\n관리자에게 문의해주세요.");
}
}
},
fnViewDetail(cd) {
// 내용이 변경된 경우
if(this.isChanged()) {
return;
}
this.selectedCd = cd;
this.findByCd();
},
// 상세 조회
async findByCd() {
if (this.selectedCd == null) return;
try {
const params = { cd: this.selectedCd };
const res = await findByCd(params);
if (res.status == 200) {
this.viewCode = res.data.data.code;
this.originCode = _.cloneDeep(this.viewCode); // 변경전 코드
this.submitStts = false;
}
} catch (error) {
const errorData = error.response.data;
if (errorData.message != null && errorData.message != "") {
alert(error.response.data.message);
} else {
alert("에러가 발생했습니다.\n관리자에게 문의해주세요.");
}
}
},
// 저장
async fnSave() {
if (this.viewCode.sysPvsnYn == 0) {
alert("시스템에서 제공하는 정보는 수정할 수 없습니다.");
return;
}
// 변경전 코드와 비교
if(_.isEqual(this.viewCode, this.originCode)) {
alert("변경할 내용이 없습니다.");
return false;
}
// 유효성 검사
if (this.validation() == false) {
return false;
}
this.viewCode.originCd = this.originCode.cd;
// 신규 등록 및 수정 설정
const action = this.viewCode.originCd ? update : save;
try {
const res = await action(this.viewCode);
alert(res.data.message);
if (res.status == 200) {
this.findAll();
// this.selectedCd = res.data.data.cd;
}
} catch (error) {
const errorData = error.response.data;
if (errorData.message != null && errorData.message != "") {
alert(error.response.data.message);
} else {
alert("에러가 발생했습니다.\n관리자에게 문의해주세요.");
}
}
},
// 삭제
async fnDel() {
if (Object.keys(this.viewCode).length === 0) {
alert("삭제 대상을 지정하세요.");
return false;
}
if (this.viewCode.sysPvsnYn == 0) {
alert("시스템에서 제공하는 정보는 삭제할 수 없습니다.");
return;
}
if (
!confirm(
"해당 코드를 삭제하시겠습니까?\n삭제시 하위코드도 모두 삭제됩니다."
)
)
return false;
try {
const res = await del(this.viewCode);
if (res.status == 200) {
alert(res.data.message);
this.viewCode = {};
this.findAll();
}
} catch (error) {
const errorData = error.response.data;
if (errorData.message != null && errorData.message != "") {
alert(error.response.data.message);
} else {
alert("에러가 발생했습니다.\n관리자에게 문의해주세요.");
}
}
},
// 최상위 신규 객체 생성
topAdd() {
// 내용이 변경된 경우
if(this.isChanged()) {
return;
}
// if (this.selectedCd != null) {
// if (!confirm("작성 중인 공통코드정보는 저장되지 않습니다.\n계속 하시겠습니까?")) {
// return;
// }
// }
this.selectedCd = null; // 선택된 코드 초기화
this.viewCode = _.cloneDeep(this.newCode);
this.originCode = _.cloneDeep(this.viewCode); // 변경전 코드
this.submitStts = true;
},
// 하위 신규 객체 생성
subAdd() {
// if (Object.keys(this.viewCode).length === 0) {
if (this.selectedCd == null) {
alert("상위 코드를 지정하세요.");
return;
} else {
// 내용이 변경된 경우
if(this.isChanged()) {
return;
}
// if (!confirm("작성 중인 공통코드정보는 저장되지 않습니다.\n계속 하시겠습니까?")) {
// return;
// }
}
const upCd = this.originCode.cd;
const upCdNm = this.originCode.cdNm;
this.viewCode = _.cloneDeep(this.newCode);
this.viewCode.upCd = upCd;
this.viewCode.upCdNm = upCdNm;
this.originCode = _.cloneDeep(this.viewCode); // 변경전 코드
this.submitStts = true;
},
validation() {
if (!this.viewCode.cd || this.viewCode.cd.trim() === "") {
alert("코드를 입력하세요.");
return false;
}
const alpha = /^[a-zA-Z_]*$/;
if (!alpha.test(this.viewCode.cd)) {
alert("코드는 영문과 언더바(_)만 사용하여 작성하세요.");
return false;
}
if (!this.viewCode.cdNm || this.viewCode.cdNm.trim() === "") {
alert("코드명을 입력하세요.");
return false;
}
return true;
},
// 드래그앤드롭
// axios: 목록 수정
async fnListUpdate() {
try {
// 내용이 변경된 경우
if(!_.isEqual(this.viewCode, this.originCode)) {
if (!confirm("공통코드 목록을 저장하시겠습니까?\n 작성 중인 공통코드정보는 저장되지 않습니다.")) {
return;
}
}
const res = await updateListProc(this.codeList);
alert(res.data.message);
if (res.status == 200) {
this.findAll();
this.findByCd();
}
} catch (error) {
const errorData = error.response.data;
if (errorData.message != null && errorData.message != "") {
alert(error.response.data.message);
} else {
alert("에러가 발생했습니다.\n관리자에게 문의해주세요.");
}
}
},
// 변경 감지
isChanged() {
if(!_.isEqual(this.viewCode, this.originCode)) {
if (!confirm("작성 중인 공통코드정보는 저장되지 않습니다.\n계속 하시겠습니까?")) {
return true;
}
}
return false;
}
},
watch: {},
computed: {
isFormDisabled() {
if (!this.viewCode) return true;
return Object.keys(this.viewCode).length === 0;
},
},
mounted() { },
};
</script>
<style scoped>
.ghost {
height: 15px;
color: transparent;
border: 1px dashed var(--blue);
}
.ghost * {
display: none;
}
</style>