mirror of
http://git.mhez-qa.uplus.co.kr/hubez/hubez-admin.git
synced 2025-12-07 02:59:22 +09:00
시스템관리 - 권한관리, 고객관리 - 청약고객관리/회원관리 추가
This commit is contained in:
kimre
255
frontend/src/modules/custMgt/components/MemberBulkRegPop.vue
Normal file
255
frontend/src/modules/custMgt/components/MemberBulkRegPop.vue
Normal file
@@ -0,0 +1,255 @@
|
||||
<template>
|
||||
<!-- <div class="wrap bg-wrap"> -->
|
||||
<div>
|
||||
<div class="dimmed modal33" @click="excelPopClose();"></div>
|
||||
<div class="popup-wrap modal33">
|
||||
<!-- 사용자 ID 대량 생성 -->
|
||||
<div class="popup modal33 popup_form">
|
||||
<div class="pop-head">
|
||||
<h3 class="pop-tit">사용자 ID 대량 생성</h3>
|
||||
</div>
|
||||
<table>
|
||||
<tbody>
|
||||
<tr>
|
||||
<th>관리자 ID</th>
|
||||
<td>{{adminId}}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>사용자 ID 업로드</th>
|
||||
<td>
|
||||
<div class="pop-btn2 bulk">
|
||||
<button class="btn-default" @click="sampleDown">샘플 다운로드</button>
|
||||
<input type="file" ref="file" style="display: none" @change="readFile" accept="application/vnd.openxmlformats-officedocument.spreadsheetml.sheet"/>
|
||||
<button class="button grey" @click="$refs.file.click()">파일 업로드</button>
|
||||
</div>
|
||||
<p class="file" id="uploadFile">
|
||||
</p>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<div class="pop-btn2">
|
||||
<button class="btn-pcolor">저장</button>
|
||||
<button class="btn-default" @click="excelPopClose">취소</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import api from '@/service/api';
|
||||
import custMgtApi from "../service/custMgtApi.js";
|
||||
import { utils_mixin, chkPattern2 } from '../service/mixins';
|
||||
import xlsx from '@/common/excel';
|
||||
import moment from 'moment';
|
||||
import XLSX from 'xlsx';
|
||||
|
||||
export default {
|
||||
name: "memberBulkRegPop",
|
||||
mixins: [utils_mixin, chkPattern2],
|
||||
data(){
|
||||
return{
|
||||
row: {},
|
||||
excelHeader: [],
|
||||
pageType: 'SAMPLE',
|
||||
adminId:'',
|
||||
varList : ["이름","휴대폰번호","기타1","기타2","기타3","기타4"],
|
||||
varList2 : ["이름","기타1","기타2","기타3","기타4"],
|
||||
nData : [],
|
||||
oData : [],
|
||||
}
|
||||
},
|
||||
|
||||
created(){
|
||||
this.getExcelHeader();
|
||||
},
|
||||
methods :{
|
||||
// 모달 띄우기
|
||||
excelPopOpen(adminId){
|
||||
this.adminId = adminId;
|
||||
var excelPop = document.getElementsByClassName('modal33');
|
||||
for(var i = 0; i < excelPop.length; i++){
|
||||
excelPop[i].style.display = 'block';
|
||||
}
|
||||
},
|
||||
// 모달 끄기
|
||||
excelPopClose(){
|
||||
//this.formReset();
|
||||
var excelPop = document.getElementsByClassName('modal33');
|
||||
for(var i = 0; i < excelPop.length; i++){
|
||||
excelPop[i].style.display = 'none';
|
||||
}
|
||||
|
||||
},
|
||||
// 저장 후 부모창 호출.
|
||||
toComplete(){
|
||||
this.getParent('custList').$refs.table.reloadData();
|
||||
this.ModalClose();
|
||||
},
|
||||
async doInsert(){
|
||||
if(this.doValidate() && window.confirm('등록 하시겠습니까?')){
|
||||
try {
|
||||
const response = await custMgtApi.insertTestId(this.row);
|
||||
const result = response.data;
|
||||
if (result != null && result.retCode == "0000") {
|
||||
alert('저장 하였습니다.');
|
||||
this.toComplete();
|
||||
}
|
||||
} catch(err) {
|
||||
alert("실패 하였습니다.");
|
||||
}
|
||||
}
|
||||
},
|
||||
async sampleDown(){
|
||||
let today = moment().format('YYYYMMDDHHmmss');
|
||||
const saveFileName = `어드민_사용자ID 대량생성_${today}.xlsx`;
|
||||
|
||||
let options = {
|
||||
header: this.excelHeader,
|
||||
dataOrder: 'header'
|
||||
};
|
||||
xlsx.export([], saveFileName, options).then(() => {});
|
||||
},
|
||||
getExcelHeader() {
|
||||
// 헤더를 mockup으로 관리한다.
|
||||
custMgtApi.getExcelHeader(this.pageType).then(res => {
|
||||
this.excelHeader = res;
|
||||
});
|
||||
},
|
||||
readFile(event) {
|
||||
const file = event.target.files[0];
|
||||
console.log(file.name);
|
||||
|
||||
// inner Html.
|
||||
const button = document.createElement('button');
|
||||
const text = document.createElement('p');
|
||||
text.innerText = file.name;
|
||||
button.addEventListener('click', () => {
|
||||
this.delFile(event);
|
||||
})
|
||||
const root = document.getElementById('uploadFile');
|
||||
root.appendChild(text);
|
||||
root.appendChild(button);
|
||||
|
||||
|
||||
|
||||
let reader = new FileReader();
|
||||
let tmpResult = {};
|
||||
const vm = this;
|
||||
reader.onerror = (e) => {
|
||||
alert('파일을 읽는 동안 에러가 발생 했습니다.');
|
||||
}
|
||||
reader.onloadend = (e) => {
|
||||
}
|
||||
|
||||
|
||||
reader.onload = (e) => {
|
||||
let data = reader.result;
|
||||
let workbook = XLSX.read(data, {type: 'binary'});
|
||||
workbook.SheetNames.forEach(sheetName => {
|
||||
workbook.Sheets[sheetName].A1.w = "id";
|
||||
workbook.Sheets[sheetName].B1.w = "name";
|
||||
workbook.Sheets[sheetName].C1.w = "mdn";
|
||||
workbook.Sheets[sheetName].D1.w = "email";
|
||||
workbook.Sheets[sheetName].E1.w = "stat";
|
||||
|
||||
// console.log(workbook.Sheets[sheetName].A1);
|
||||
const rowObj = XLSX.utils.sheet_to_json(workbook.Sheets[sheetName]);
|
||||
// const rowObj = XLSX.utils.sheet_to_json(wb.Sheets[sheetName],{raw:true});
|
||||
tmpResult = rowObj;
|
||||
const limitCnt = 101;
|
||||
|
||||
|
||||
if(rowObj.length > limitCnt){
|
||||
alert('100건이상은 등록되지 않습니다.');
|
||||
return false;
|
||||
}
|
||||
|
||||
for (const [idx,r] of rowObj.entries()) {
|
||||
if(idx > limitCnt-1 ) {
|
||||
break;
|
||||
}
|
||||
let {ID,이름,휴대폰번호,이메일,ID잠금} = r;
|
||||
ID = ''+(vm.isNull(ID)?'':ID);
|
||||
이름 = ''+(vm.isNull(이름)?'':이름);
|
||||
휴대폰번호 = ''+(vm.isNull(휴대폰번호)?'':휴대폰번호);
|
||||
이메일 = ''+(vm.isNull(이메일)?'':이메일);
|
||||
ID잠금 = ''+(vm.isNull(ID잠금)?'':ID잠금);
|
||||
|
||||
// 휴대폰번호=''+휴대폰번호;
|
||||
if(!vm.isMobile(휴대폰번호)){
|
||||
if(vm.isMobile2(휴대폰번호)){
|
||||
휴대폰번호='0'+휴대폰번호;
|
||||
}
|
||||
}
|
||||
let {retVal,msg } = vm.validXlxs({이름,휴대폰번호});
|
||||
if(retVal){
|
||||
const pVal = [{ name:'이름',val:이름, len:20,},
|
||||
{ name:'ID잠금',val:ID잠금, len:4,},];
|
||||
|
||||
const rVal = vm.isTitle(pVal);
|
||||
if(rVal.retVal){
|
||||
vm.nData.push({name:이름,mdn:휴대폰번호,msg});
|
||||
}else{
|
||||
vm.oData.push({이름,휴대폰번호,오류내용:rVal.msg});
|
||||
}
|
||||
}else{
|
||||
vm.oData.push({이름,휴대폰번호,오류내용:msg});
|
||||
}
|
||||
}
|
||||
});
|
||||
console.log(vm.nData);
|
||||
// this.excelJsonData=tmpResult;
|
||||
};
|
||||
reader.readAsBinaryString(file);
|
||||
},
|
||||
validXlxs({이름,휴대폰번호}){
|
||||
if(this.isNull(이름)){
|
||||
return {retVal:false,msg:'이름 누락'};
|
||||
}
|
||||
if(this.isNull(휴대폰번호)){
|
||||
return {retVal:false,msg:'휴대폰번호 누락'};
|
||||
}
|
||||
if(!this.isMobile(휴대폰번호)){
|
||||
if(!this.isMobile2(휴대폰번호)){
|
||||
return {retVal:false,msg:'휴대폰번호 형식 오류'};
|
||||
}
|
||||
}
|
||||
|
||||
return {retVal:true,msg:'정상'};
|
||||
},
|
||||
isTitle(pVal) {
|
||||
for (const o of pVal) {
|
||||
if (this.bytes(o.val) > o.len) {
|
||||
return {retVal:false,msg:`${o.name} 컬럼: 문자열 길이 오류(${o.len}자)`};
|
||||
}
|
||||
const strRegExp = '^[ㄱ-ㅎㅏ-ㅣ가-힣a-zA-Z0-9]*$';
|
||||
const regExp_g = new RegExp(strRegExp,'g');
|
||||
if(!(regExp_g.test(o.val))){
|
||||
return {retVal:false,msg:`${o.name} 컬럼: 특수 문자 오류`};
|
||||
}
|
||||
}
|
||||
return {retVal:true,msg:'정상'};
|
||||
},
|
||||
delFile(event){
|
||||
console.log("del~~~~");
|
||||
const file = event.target.files[0];
|
||||
console.log(file.name);
|
||||
//this.$refs.file.reset();
|
||||
this.$refs.file.value=null;
|
||||
let element = document.getElementById("uploadFile");
|
||||
while (element.firstChild) {
|
||||
element.removeChild(element.firstChild);
|
||||
}
|
||||
// uploadFile
|
||||
}
|
||||
}
|
||||
}
|
||||
</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