Files
hubez-admin/frontend/src/modules/custMgt/views/MemberAdminDetail.vue
2022-10-05 17:56:09 +09:00

500 lines
18 KiB
Vue

<template>
<div class="contents">
<div class="contents_wrap">
<div class="top_wrap">
<h3 class="title">청약정보조회</h3>
<p class="breadcrumb">고객관리 &gt; 청약정보조회 &gt; 회원관리</p>
</div>
<div class="table table_form">
<form action="" target="_blank" method="post" ref="form" onSubmit="return false;">
<input type="hidden" name="svcUserId" id="svcUserId" v-model="svcUserId" />
<input type="hidden" name="ezSvcUserAuthKey" id="ezSvcUserAuthKey" v-model="ezSvcUserAuthKey" />
</form>
<table>
<colgroup>
<col style="width: 140px" />
<col style="width: auto" />
<col style="width: auto" />
<col style="width: 140px" />
<col style="width: auto" />
<col style="width: auto" />
</colgroup>
<tbody>
<tr>
<th>이름</th>
<td colspan="2">{{ userNm }}</td>
</tr>
<tr>
<th>등록일</th>
<td colspan="2">{{ regDt }}</td>
<th>구분</th>
<td colspan="2">{{ userType }}</td>
</tr>
<tr>
<th>ID</th>
<td colspan="2">
{{ userId }}
<button type="button" class="button grey btn-a" @click="homeLogin">로그인</button>
</td>
<th>관리자명</th>
<td colspan="2">{{ adminId }} / {{ adminNm }}</td>
</tr>
<tr class="tr_input w30">
<th>발송한도 설정</th>
<td colspan="2" v-if="sendingLimit == '0'">
<input type="text" v-model="sendingLimit" ref="_sendingLimit" disabled />
</td>
<td colspan="2" v-if="sendingLimit != '0'">
<input
type="text"
v-model.trim="sendingLimit"
ref="_sendingLimit"
@keypress="onlyNum"
@input="onlyNum"
maxlength="20"
/>
</td>
<th>라인타입</th>
<td colspan="2">
<select name="" id="" v-model="lineType">
<option value="NORMAL">일반</option>
<option value="BATCH">배치</option>
<option value="REAL">실시간</option>
</select>
</td>
</tr>
<tr class="w30">
<th>ID 잠금</th>
<td colspan="2">
<input type="radio" name="userStat" value="01" id="right_radio1" v-model="userStat" />
<label for="right_radio1">사용</label>
<input type="radio" name="userStat" value="02" id="right_radio2" v-model="userStat" />
<label for="right_radio2">미사용</label>
</td>
<th class="center">마지막 접속일</th>
<td colspan="2">{{ lastLoginDt }}</td>
</tr>
<tr>
<th>메모</th>
<td colspan="5">
<div class="input-memo">
<textarea
class="memo_text"
placeholder="메모 입력란입니다. 작성글은 저장 버튼으로 저장되고 마지막 저장 내용은 남아 있습니다"
v-model="memo"
></textarea>
<!--
<textarea class="memo_text" cols="160" rows="10" placeholder="메모 입력란입니다. 작성글은 저장 버튼으로 저장되고 마지막 저장 내용은 남아 있습니다" v-model="memo"></textarea>
-->
<!--
textarea 구글 검색하셔서 태그 옵션 확인해보면 좋아요
<textarea name="" id="" cols="30" rows="10" placeholder="메모 입력란입니다. 작성글은 저장 버튼으로 저장되고 마지막 저장 내용은 남아 있습니다"></textarea>
-->
<button type="button" class="button grey btn-a" @click="memoTotalPopOpen()">전체 메모보기</button>
</div>
</td>
</tr>
</tbody>
</table>
</div>
<div>
<div class="info">
<div class="count">
사용자ID 정보
<p>( 최대 100개까지 등록 가능 )</p>
</div>
<div class="button_group" v-show="isActive">
<button type="button" class="button blue add" @click="memberInsertPopOpen()">사용자 ID 생성</button>
<button type="button" class="button blue add" @click="excelPopOpen()">사용자 ID 대량생성</button>
<button type="button" class="button white del" @click="deleteMember()">삭제</button>
</div>
</div>
<div class="table">
<table>
<colgroup>
<col width="10%" />
<col width="15%" />
<col width="15%" />
<col width="15%" />
<col width="15%" />
<col width="15%" />
<col width="15%" />
</colgroup>
<thead>
<tr>
<th>
<input type="checkbox" id="admin_check1" v-model="selectAll" /><label for="admin_check1"></label>
</th>
<th>No</th>
<th>ID</th>
<th>이름</th>
<th>휴대폰번호</th>
<th>ID 잠금</th>
<th>수정</th>
</tr>
</thead>
<tbody>
<tr v-for="(option, i) in list" v-bind:key="i">
<td>
<input type="checkbox" :id="'chk' + option.userId" v-model="selected" :value="option.userId" /><label
:for="'chk' + option.userId"
></label>
</td>
<td>{{ option.no }}</td>
<td>{{ option.userId }}</td>
<td>{{ option.userNm }}</td>
<td>{{ option.mdn }}</td>
<td>
<!-- <input type="checkbox" id="user_id_status01" name="user_id_status" v-model="option.userStat" true-value='정상' false-value='사용중지' :style="{cursor: 'default'}" disabled/> -->
<input
type="checkbox"
id="user_id_status01"
name="user_id_status"
v-model="option.userStat"
true-value="정상"
false-value="사용중지"
disabled
/>
<label class="toggle_switch" for="user_id_status01"></label>
</td>
<td v-if="isActive">
<button type="button" class="button white btn-a" @click="memberUpdatePopOpen(option.userId)">
수정
</button>
</td>
<td v-else></td>
</tr>
<tr v-if="list.length === 0">
<td colspan="7">등록된 사용자 정보가 없습니다.</td>
</tr>
</tbody>
</table>
</div>
</div>
<div class="pop-btn2">
<button class="btn-pcolor" type="button" @click="updateAdminInfoTotal()">저장</button>
<button class="btn-default" type="button" @click="toComplete()">취소</button>
</div>
<member-bulk-reg-pop ref="memberBulkRegPop"> </member-bulk-reg-pop>
<member-reg-pop ref="memberRegPop"> </member-reg-pop>
<member-modify-pop ref="memberModifyPop"> </member-modify-pop>
<memo-total-pop ref="memoTatalListPop"> </memo-total-pop>
<common-modal ref="commmonModal"></common-modal>
<validation-confirm-pop ref="validationConfirmPopModal"> </validation-confirm-pop>
</div>
</div>
</template>
<style>
.defaultCursor {
cursor: default;
}
</style>
<script>
import custMgtApi from '../service/custMgtApi.js';
import { utils_mixin, chkPattern2 } from '../service/mixins';
import MemberBulkRegPop from '../components/MemberBulkRegPop';
import MemberRegPop from '../components/MemberRegPop';
import MemberModifyPop from '../components/MemberModifyPop';
import MemoTotalPop from '../components/MemoTotalPop';
import commonModal from '@/components/modal/commonModal';
import ValidationConfirmPop from '@/modules/custMgt/components/ValidationConfirmPop';
export default {
name: 'memberAdminDetail',
mixins: [utils_mixin, chkPattern2],
watch: {
stat() {
},
},
data() {
return {
row: {},
list: [],
totalItems: 0,
isView: 1,
userNm: '',
regDt: '',
userType: '',
userId: '',
adminId: '',
adminNm: '',
sendingLimit: '',
lineType: '',
userStat: '',
lastLoginDt: '',
memo: '',
mdn: '',
email: '',
userTotalCnt: 0,
selected: [],
svcUserId: '',
ezSvcUserAuthKey: '',
homePageUrl: '',
isActive: true,
//applyTbStyle: 'cursor: default;',
oldMemo: '',
};
},
props: {
serviceId: {
type: String,
default: '',
},
},
components: {
MemberBulkRegPop,
MemberRegPop,
MemberModifyPop,
MemoTotalPop,
commonModal,
ValidationConfirmPop,
},
created() {
if (this.$route.params.serviceId != null) {
this.$store.commit('dataStore/updateDataStore', this.$route.params.serviceId);
this.userId = this.$route.params.serviceId;
this.memberDetail(this.$route.params.serviceId);
}
},
destroyed() {
this.$store.commit('searchcondition/updateSearchCondition', {
page: 1,
perPage: 50,
params: {
searchType1: '',
searchType2: '',
searchText1: '',
},
});
this.$store.commit('dataStore/updateDataStore', '');
},
mounted() {},
computed: {
selectAll: {
get() {
return this.list ? (this.selected ? this.selected.length === this.list.length : false) : false;
},
set(value) {
const selected = [];
if (value) {
this.list.forEach((com) => {
selected.push(com.userId);
});
}
this.selected = selected;
},
},
},
methods: {
valAlert(props) {
this.$refs.commmonModal.alertModalOpen(props);
},
valConfirm(props) {
this.$refs.commmonModal.confirmModalOpen(props);
},
async memberDetail(serviceId) {
this.svcUserId = serviceId;
this.row.userId = serviceId;
try {
const response = await custMgtApi.memberAdminDetail(this.row);
const result = response.data;
if (result != null && result.retCode == '0000') {
// this.formReset();
this.userNm = result.data.userNm;
this.userId = result.data.userId;
this.regDt = result.data.regDt;
this.userType = result.data.userType;
this.adminId = result.data.adminId;
this.adminNm = result.data.adminNm;
//this.sendingLimit = result.data.sendingLimit.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ',');
this.sendingLimit = result.data.sendingLimit;
this.lineType = result.data.lineType;
this.userStat = result.data.userStat;
if (this.userStat === '02') {
this.isActive = false;
}
this.lastLoginDt = result.data.lastLoginDt;
this.memo = result.data.memo;
this.oldMemo = result.data.memo;
this.mdn = result.data.mdn;
this.email = result.data.email;
this.list = result.data.list;
this.userTotalCnt = result.data.list.length;
this.totalItems = result.data.paging.totalCnt;
this.homePageUrl = result.data.homePageUrl;
this.ezSvcUserAuthKey = result.data.authKey;
}
} catch (error) {
this.row.title = '청약고객관리';
this.row.msg1 = '실패 하였습니다.';
this.$refs.commmonModal.alertModalOpen(this.row);
}
},
/** 저장 */
async updateAdminInfoTotal() {
this.row = {};
this.row.userId = this.adminId;
this.row.sendingLimit = this.sendingLimit;
this.row.lineType = this.lineType;
this.row.userStat = this.userStat;
if(this.memo != this.oldMemo){
this.row.memo = this.memo;
} else {
this.row.memo = '';
}
try {
const response = await custMgtApi.updateAdminInfoTotal(this.row);
const result = response.data;
if (result != null && result.retCode == '0000') {
this.row.title = '청약고객관리';
this.row.msg1 = '저장 하였습니다.';
this.$refs.commmonModal.alertModalOpen(this.row);
this.memberDetail(this.row.userId);
} else if (result != null && result.retCode == '4019') {
this.row.title = '청약고객관리';
this.row.msg1 = '발송한도금액이 정액한도금액보다 작습니다.';
this.$refs.commmonModal.alertModalOpen(this.row);
} else {
this.row.title = '청약고객관리';
this.row.msg1 = '실패 하였습니다.';
this.$refs.commmonModal.alertModalOpen(this.row);
}
} catch (error) {
this.row.title = '청약고객관리';
this.row.msg1 = '실패 하였습니다.';
this.$refs.commmonModal.alertModalOpen(this.row);
}
},
// 저장 후 부모창 호출.
toComplete() {
this.row.serviceId = this.userId;
this.$router.push({ name: 'memberList', params: this.row });
},
excelPopOpen() {
if (this.userTotalCnt >= 100) {
// 사용자등록제한_최대100개까지
this.$refs.validationConfirmPopModal.validationMaxlimitOpen();
return false;
}
this.$refs.memberBulkRegPop.excelPopOpen(this.adminId, this.totalItems);
},
memberUpdatePopOpen(target) {
this.row.userId = target;
this.row.adminId = this.adminId;
this.$refs.memberModifyPop.memberUpdateModalOpen(this.row);
},
memberInsertPopOpen() {
if (this.userTotalCnt >= 100) {
// 사용자등록제한_최대100개까지
this.$refs.validationConfirmPopModal.validationMaxlimitOpen();
return false;
}
this.row.adminId = this.adminId;
this.row.userTotalCnt = this.userTotalCnt;
this.$refs.memberRegPop.memberInsertModalOpen(this.row);
},
memoTotalPopOpen() {
this.row.adminId = this.adminId;
this.$refs.memoTatalListPop.memoTotalModalOpen(this.row);
},
deleteMember() {
if (this.selected.length === 0) {
this.row.title = '청약고객관리';
this.row.msg1 = '삭제대상을 체크해주세요.';
this.$refs.commmonModal.alertModalOpen(this.row);
return false;
}
this.row.title = '청약고객관리';
this.row.msg1 = '삭제 하시겠습니까?';
this.$refs.commmonModal.confirmModalOpen2(this.row);
},
async memberDelete() {
var serviceId = this.adminId;
this.row.list = this.selected.map((row) => ({ userId: row }));
this.row.adminId = this.adminId;
try {
let response = await custMgtApi.deleteUser(this.row);
const result = response.data;
if (result != null && result.retCode == '0000') {
this.memberDetail(serviceId);
} else {
this.row = {};
this.row.title = '청약고객관리';
this.row.msg1 = '실패 하였습니다.';
this.$refs.commmonModal.alertModalOpen(this.row);
}
} catch (error) {
this.row = {};
this.row.title = '청약고객관리';
this.row.msg1 = '실패 하였습니다.';
this.$refs.commmonModal.alertModalOpen(this.row);
}
},
async setAuthData() {
// 권한 옵션.
// api.commAuth().then((response) => {
// this.authType = response.data.data.list;
// });
try {
const response = await api.commAuth();
if(response.data.retCode == '0000'){
this.authType = response.data.data.list;
}
}catch(err){
}
},
// formReset() {
// Object.assign(this.$data, this.$options.data());
// },
homeLogin() {
if(this.userStat == '02'){
this.row = {};
this.row.title = '로그인';
this.row.msg1 = '사용 중지된 계정입니다.';
this.$refs.commmonModal.alertModalOpen(this.row);
return false;
}else if(this.userStat == '99'){
this.row = {};
this.row.title = '로그인';
this.row.msg1 = '삭제된 계정입니다.';
this.$refs.commmonModal.alertModalOpen(this.row);
return false;
}
this.$refs.form.action = this.homePageUrl;
this.svcUserId = this.userId;
//console.log(this.$refs.form);
this.$refs.form.submit();
},
confirmCalbackFnc(props) {
if (props.result) {
this.memberDelete();
}
},
// 대량 등록후 확인 처리
failFileuploadOk() {
// 대량등록 팝업 닫기
this.$refs.memberBulkRegPop.excelPopClose();
// reroad
this.memberDetail(this.$route.params.serviceId);
},
successFileuploadOk() {
// 대량등록 팝업 닫기
this.$refs.memberBulkRegPop.excelPopClose();
// reroad
this.memberDetail(this.$route.params.serviceId);
},
},
};
import '../../../assets/css/checktoggle.css';
</script>