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
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 sch-full">
<div class="content">
<div class="scroll">
<div class="form-box">
<div class="form-box-title">
<p>기본정보</p>
<p><span>*</span>필수입력</p>
</div>
<div class="form-content">
<div>
<label for="" class="form-title"><span>*</span> 제어 유형</label>
<select name="selectType" id="selectType" class="form-select sm"
v-model="accesCtrl.cntrlType">
<option value="">전체</option>
<option v-for="(item, idx) in codeList" :key="idx" :value="item.cd">{{ item.cdNm }}
</option>
</select>
</div>
<div class="border-bottom">
<label for="" class="form-title"><span>*</span> 제어 IP</label>
<div class="form-group">
<input type="text" class="form-control sm" v-model="accesCtrl.cntrlIp" placeholder="1~255 범위의 숫자로 구성하여 형식에 맞게 작성해주세요." />
<span>ex) 192.168.0.1 / 192.168.0.*</span>
</div>
</div>
<div>
<label for="" class="form-title"><span>*</span> 제어 경로</label>
<input type="text" class="form-control sm" v-model="accesCtrl.cntrlCrs" placeholder="제어할 경로 URL을 입력하세요."/>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="btn-wrap">
<button class="btn sm main" @click="fnInsert">{{ accesCtrl.acsCntrlId == 0 ? '등록' :
'수정'}}</button>
<button class="btn sm tertiary" @click="fnCancel">취소</button>
</div>
</template>
<script>
import { findByAcces, save, update } from '../../../../../resources/api/accesCtrl'
export default {
components: {
},
data() {
return {
codeList: [], // 유형
accesCtrl: {} // 접근제어 객체
}
},
created() {
this.fnSelectOne();
},
methods: {
// 목록으로 이동
fnCancel() {
if (!confirm('등록을 취소하시겠습니까?')) {
return;
}
if (this.accesCtrl.acsCntrlId == null || this.accesCtrl.acsCntrlId == 0) {
this.$router.push({
name: 'admNetworkAccessControlSelectList',
});
} else {
this.$router.push({
name: 'admNetworkAccessControlSelectListOne',
query: {
pageId: this.accesCtrl.acsCntrlId
},
});
}
},
// 조회
async fnSelectOne() {
try {
const params = {
'acsCntrlId': this.$route.query.pageId
}
const res = await findByAcces(params);
this.accesCtrl = res.data.data.accesCtrl; // 접근제어 객체
if (this.accesCtrl.acsCntrlId == 0) {
this.accesCtrl.cntrlType = ''; // 공백으로 초기화
}
this.codeList = res.data.data.codeList; // 유형
} catch (error) {
alert('에러가 발생했습니다.\n시스템관리자에게 문의하세요.');
}
},
fnInsert() {
if (this.accesCtrl.acsCntrlId == null || this.accesCtrl.acsCntrlId == 0) {
this.fnSave();
} else {
this.fnUpdate();
}
},
// 등록
async fnSave() {
if (!this.Validation()) {
return;
}
try {
const res = await save(this.accesCtrl);
alert(res.data.message);
const acsCntrlId = res.data.data.acsCntrlId;
if (res.status == 200) {
this.$router.push({
name: 'admNetworkAccessControlSelectListOne',
query: {
pageId: acsCntrlId
},
});
}
} catch (error) {
alert('에러가 발생했습니다.\n시스템관리자에게 문의하세요.');
}
},
// 수정
async fnUpdate() {
if (!this.Validation()) {
return;
}
try {
const res = await update(this.accesCtrl);
alert(res.data.message);
if (res.status == 200) {
this.$router.push({
name: 'admNetworkAccessControlSelectListOne',
query: {
pageId: this.accesCtrl.acsCntrlId
},
});
}
} catch (error) {
alert('에러가 발생했습니다.\n시스템관리자에게 문의하세요.');
}
},
// 유효성 검사
Validation() {
// const ipFilter = /^(25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.(25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.(25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.(25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)$/;
const ipFilter = /^(\*|[1-9]?[0-9]|1\d\d|2[0-4]\d|25[0-5])(\.(\*|[1-9]?[0-9]|1\d\d|2[0-4]\d|25[0-5])){3}$/;
if (this.accesCtrl.cntrlType == null || this.accesCtrl.cntrlType == '') {
alert('제어 유형을 지정해주세요.');
return false;
}
if (this.accesCtrl.cntrlIp == null || this.accesCtrl.cntrlIp == '') {
alert('제어 IP를 입력해주세요.');
return false;
} else if (!ipFilter.test(this.accesCtrl.cntrlIp)) {
alert('ip 형식이 다릅니다.');
return false;
}
if (this.accesCtrl.cntrlCrs == null || this.accesCtrl.cntrlCrs == '') {
alert('제어 경로를 입력해주세요.');
return false;
}
return true;
}
},
watch: {
},
computed: {
},
mounted() {
}
}
</script>