mirror of
http://git.mhez-qa.uplus.co.kr/hubez/hubez-admin.git
synced 2025-12-07 06:52:01 +09:00
- 시스템관리 > 관리자목록조회, 관리자등록, 관리자수정, 관리자삭제, 관리자상세조회
This commit is contained in:
kimre
265
frontend/src/modules/sysMgt/components/AdminRegPop.vue
Normal file
265
frontend/src/modules/sysMgt/components/AdminRegPop.vue
Normal file
@@ -0,0 +1,265 @@
|
||||
<template>
|
||||
<!-- <div class="wrap bg-wrap"> -->
|
||||
<div>
|
||||
<div class="dimmed" @click="ModalClose();"></div>
|
||||
<div class="popup-wrap">
|
||||
<!-- 관리자/유치채널 등록 -->
|
||||
<div class="popup modal20 popup_form">
|
||||
<div class="pop-head">
|
||||
<h3 class="pop-tit" v-if="insertType === 1">관리자 등록</h3>
|
||||
<h3 class="pop-tit" v-else>유치채널 사용자 등록</h3>
|
||||
</div>
|
||||
<form autocomplete="off" ref="adminRegForm">
|
||||
<table>
|
||||
<tbody>
|
||||
<tr>
|
||||
<th>마당 ID</th>
|
||||
<td class="input_search">
|
||||
<input type="text" placeholder="아이디 입력" v-model.trim="madangId" ref="madangId">
|
||||
<button type="button" class="button grey" >조회</button>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>비밀번호</th>
|
||||
<td><input type="password" @keypress="onlyPassword" @input="onlyPassword" required minlength="8" maxlength="16" ref="_pwd1" v-model.trim="userPwd1"></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>비밀번호 확인</th>
|
||||
<td><input type="password" @keypress="onlyPassword" @input="onlyPassword" required minlength="8" maxlength="16" ref="_pwd2" v-model.trim="userPwd2"></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>이름</th>
|
||||
<td><input type="text" @keypress="onlyName" @input="onlyName" v-model.trim="userNm" ref="_userNm" required maxlength="40"></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>휴대폰번호</th>
|
||||
<td><input type="number" placeholder="- 자 제외 숫자만 입력" v-model.trim="mdn" v-on:keyup="onlyNum" @input="onlyNum" minlength="10" maxlength="11" ref="_phone"></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>이메일</th>
|
||||
<td><input type="email" v-model.trim="email" @keypress="onlyEmail" @input="onlyEmail" maxlength="20" ref="_email"></td>
|
||||
</tr>
|
||||
<tr v-if="insertType === 2">
|
||||
<th>코드</th>
|
||||
<td><input type="text" disabled ref="_code" v-model.trim="code"></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>권한</th>
|
||||
<td v-if="insertType === 1">
|
||||
<div v:class="select_box">
|
||||
<select name="" id="right" v-model="auth" ref="_auth">
|
||||
<option value="">선택</option>
|
||||
<option v-for="(option, i) in authType" v-bind:value="option.autCd" v-bind:key="i">
|
||||
{{ option.autNm }}
|
||||
</option>
|
||||
</select>
|
||||
</div>
|
||||
</td>
|
||||
<td v-else><input type="text" disabled value="대리점"></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th class="center">상태</th>
|
||||
<td>
|
||||
<input type="radio" name="state" value="01" id="popup_radio1" v-model="stat">
|
||||
<label for="popup_radio1">사용</label>
|
||||
<input type="radio" name="state" value="02" id="popup_radio2" v-model="stat">
|
||||
<label for="popup_radio2">정지</label>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</form>
|
||||
<div class="pop-btn2">
|
||||
<button class="btn-default" @click="ModalClose();">취소</button>
|
||||
<button class="btn-pcolor" @click="doInsert">저장</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import api from '@/service/api';
|
||||
import sysMgtApi from "../service/sysMgtApi.js";
|
||||
import { utils_mixin, chkPattern2 } from '../service/mixins';
|
||||
import lodash from "lodash";
|
||||
|
||||
export default {
|
||||
name: "adminRegPop",
|
||||
mixins: [utils_mixin, chkPattern2],
|
||||
watch:{
|
||||
stat(){
|
||||
console.log('watch : ', this.stat)
|
||||
}
|
||||
},
|
||||
data(){
|
||||
return{
|
||||
row: {},
|
||||
authType: [],
|
||||
insertType:0,
|
||||
madangId:'',
|
||||
name:'',
|
||||
mdn:'',
|
||||
email:'',
|
||||
auth:'',
|
||||
stat: '',
|
||||
userNm:"",
|
||||
userPwd1:"",
|
||||
userPwd2:"",
|
||||
code:"",
|
||||
}
|
||||
},
|
||||
model: {
|
||||
prop: 'sendData',
|
||||
event: 'event-data'
|
||||
},
|
||||
props: ['sendData'],
|
||||
created(){
|
||||
this.formReset();
|
||||
this.setAuthData();
|
||||
},
|
||||
methods :{
|
||||
doPwdValidate(){
|
||||
if(this.isNull(this.userPwd1)){
|
||||
alert("비밀번호를 입력해 주세요.");
|
||||
this.$refs._pwd1.focus();
|
||||
return false;
|
||||
}
|
||||
if(this.isNull(this.userPwd2)){
|
||||
alert("비밀번호 확인을 입력해 주세요.");
|
||||
this.$refs._pwd2.focus();
|
||||
return false;
|
||||
}
|
||||
if(!lodash.isEqual(this.userPwd1, this.userPwd2)){
|
||||
alert("비밀번호가 일치하지 않습니다.");
|
||||
this.$refs._pwd2.focus();
|
||||
return false;
|
||||
}
|
||||
const pwdLen = this.bytes(this.userPwd1);
|
||||
if(!(pwdLen >= 8 && pwdLen <= 16)){
|
||||
alert("비밀번호는 8~16자의 영문, 숫자, 특수문자(!,@, $, %, ^, &, *) 조합이 필요합니다.");
|
||||
this.$refs._pwd1.focus();
|
||||
return false;
|
||||
}
|
||||
const pEng = /[A-Za-z]/g; // 영문자
|
||||
const pNum = /[0-9]/g; // 숫자
|
||||
const pSpc = /[!@$%^&*]/g; // 특수문자
|
||||
if(!(pEng.test(this.userPwd1) && pNum.test(this.userPwd1) && pSpc.test(this.userPwd1))) {
|
||||
alert("비밀번호는 8~16자의 영문, 숫자, 특수문자(!,@, $, %, ^, &, *) 조합이 필요합니다.");
|
||||
this.$refs._pwd1.focus();
|
||||
return;
|
||||
}
|
||||
this.row.adminPw=this.userPwd1;
|
||||
return true;
|
||||
},
|
||||
doValidate(){
|
||||
if(!this.doPwdValidate()){
|
||||
return false;
|
||||
}
|
||||
if(this.isNull(this.userNm)){
|
||||
alert("이름을 입력해 주세요");
|
||||
this.$refs._userNm.focus();
|
||||
return false;
|
||||
}
|
||||
if(this.isNull(this.mdn)){
|
||||
alert('휴대폰번호를 입력해주세요.');
|
||||
this.$refs._phone.focus();
|
||||
return false;
|
||||
}
|
||||
const hp = this.mdn;
|
||||
if(!this.isNull(hp) && !this.isMobile(hp)){
|
||||
alert("휴대폰 번호 형식이 잘못되었습니다. 확인해 주세요");
|
||||
this.$refs._phone.focus();
|
||||
return false;
|
||||
}
|
||||
if(this.isNull(this.email)){
|
||||
alert('이메일을 입력해주세요.');
|
||||
this.$refs._email.focus();
|
||||
return false;
|
||||
}
|
||||
const email = this.email;
|
||||
if(!this.isNull(email) && !lodash.isEqual(email,'@') && !this.emailCheck(email)){
|
||||
alert("이메일 형식이 잘못되었습니다. 확인해 주세요");
|
||||
this.$refs._email.focus();
|
||||
return false;
|
||||
}
|
||||
if(this.isNull(this.auth)){
|
||||
alert('권한을 선택 해주세요.');
|
||||
this.$refs._auth.focus();
|
||||
return false;
|
||||
}
|
||||
if(this.isNull(this.stat)){
|
||||
alert('상태를 선택 해주세요.');
|
||||
// this.$refs._auth.focus();
|
||||
return false;
|
||||
}
|
||||
this.row.madangId=this.madangId;
|
||||
this.row.name=this.userNm;
|
||||
this.row.mdn=hp;
|
||||
this.row.email=email;
|
||||
if(this.insertType == 2){
|
||||
this.row.auth='1003';
|
||||
}else{
|
||||
this.row.auth=this.auth;
|
||||
}
|
||||
this.row.stat=this.stat;
|
||||
return true;
|
||||
},
|
||||
// 모달 띄우기
|
||||
ModalOpen(insertType){
|
||||
this.insertType=insertType;
|
||||
var dimmed = document.getElementsByClassName('dimmed');
|
||||
dimmed[0].style.display = 'block';
|
||||
var wrap = document.getElementsByClassName('popup-wrap');
|
||||
wrap[0].style.display = 'block';
|
||||
var obj = document.getElementsByClassName('modal20');
|
||||
obj[0].style.display = 'block';
|
||||
},
|
||||
// 모달 끄기
|
||||
ModalClose(){
|
||||
this.formReset();
|
||||
var dimmed = document.getElementsByClassName('dimmed');
|
||||
dimmed[0].style.display = 'none';
|
||||
var wrap = document.getElementsByClassName('popup-wrap');
|
||||
wrap[0].style.display = 'none';
|
||||
var popup = document.getElementsByClassName('modal20');
|
||||
popup[0].style.display = 'none';
|
||||
|
||||
},
|
||||
// 저장 후 부모창 호출.
|
||||
toComplete(){
|
||||
this.getParent('adminList').$refs.table.reloadData();
|
||||
this.ModalClose();
|
||||
},
|
||||
async doInsert(){
|
||||
if(this.doValidate() && window.confirm('등록 하시겠습니까?')){
|
||||
try {
|
||||
const response = await sysMgtApi.insertAdmin(this.row);
|
||||
const result = response.data;
|
||||
if (result != null && result.retCode == "0000") {
|
||||
alert('저장 하였습니다.');
|
||||
this.toComplete();
|
||||
}
|
||||
} catch(err) {
|
||||
alert("실패 하였습니다.");
|
||||
}
|
||||
}
|
||||
},
|
||||
setAuthData() {
|
||||
// 권한 옵션.
|
||||
api.commAuth().then(response => {
|
||||
this.authType = response.data.data.list;
|
||||
});
|
||||
},
|
||||
formReset(){
|
||||
this.$refs.adminRegForm.reset();
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.popup-btn-wrap {width: 500px; margin: auto; padding: 100px 0;}
|
||||
.popup-btn-wrap button {width: 100%; margin-bottom: 10px; height: 50px; border-radius: 5px; box-shadow: none; border: 1px solid #000; }
|
||||
.popup-btn-wrap button:hover {background: #000; color: #fff;}
|
||||
</style>
|
||||
Reference in New Issue
Block a user