File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
2023-06-22
File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="ui" uri="http://egovframework.gov/ctl/ui"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn" %>
<!DOCTYPE html>
<html lang="ko">
<head>
<!-- <link rel="stylesheet" href="/publish/css/jquery.mCustomScrollbar.css">
<script src="/publish/js/jquery.mCustomScrollbar.concat.min.js"></script>
<script src="/publish/js/content.js"></script>
<script src="/publish/js/calendar.js"></script>
<script src="/publish/js/popup.js"></script>
<script src="/js/txtByteChk.js"></script> -->
<link rel="stylesheet" href="/css/web/colorbox/colorbox.css">
<style>
.layer_pop {width:100%; height:100%; border:5px solid #0b9f8f; border-top:none;}
.layer_pop .pop_tit {padding:0 20px;font-weight:600;font-size:16px;color:#fff;line-height:45px;background:#0b9f8f;}
.layer_pop .pop_cons {margin:30px 20px; overflow:hidden;}
.pop_top_ex li.ico {display:block;}
.pop_top_ex li {margin-bottom:2px; padding-left:10px; background-position: -5px -306px;}
.pop_top_ex li:last-child {margin-bottom:0;}
.acen {
text-align: center;
}
.mT20 {
margin-top: 20px;
}
.exl_box {
padding: 25px 30px;
background: #fafafa;
border-top: 1px solid #444;
border-bottom: 1px solid #444;
}
.btn_m_grey {
display: inline-block;
padding: 0 25px;
font-size: 14px;
line-height: 38px;
height: 38px;
color: #fff;
text-align: center;
font-weight: bold;
background: #777;
}
.f_red {
color: #cc0000;
}
</style>
</head>
<div class="layer_pop">
<div class="pop_tit">엑셀파일 불러오기</div>
<div class="pop_cons loading_area">
<ul class="pop_top_ex">
<li class="ico">엑셀 파일은 정해진 양식에 맞춰 업로드해야 합니다. <a href="/publish/address_sample.xlsx" class="f_red">[엑셀 샘플 다운로드]</a></li>
<li class="ico">이름, 휴대폰번호는 필수로 입력해주세요.<br/> (집/사무실, 메모1, 메모2, 메모3은 선택사항)</li>
<li class="ico">첫 번째 시트(Sheet)에 등록해 주세요.</li>
<li class="ico">이곳에 입력된 번호는 주소록에 저장되지 않으니, 저장을 원하실 경우 주소록을<br />먼저 이용해주세요.
</li>
</ul>
<!-- pop_top_ex -->
<div class="exl_box mT20 acen">
<p style="border-bottom: none;">
<input type="file" name="uploadFile" />
</p>
<span id="spanFileName" class="hide"></span>
</div>
<div class="mT30 acen">
<a id="btnSubmitExcel" href="javascript:;" class="btn_m_grey">적용하기</a>
</div>
</div>
<!-- pop_cons-->
</div>
<!-- layer_pop-->
<script>
//9627개까지만 바인딩 가능 : 이후 jquery core 에러 Function.map
var _perSplice = 1000;
var _hasLeftCnt = 0;
var _iLimitSendCnt = 100000;
var _iMaxCharCnt = 0 ; //parseInt(removeComma($('#spanMaxCnt').text()), 10);
var _sCurrCntId = 'spanCurrCnt';
var _regExp1 = /(^02.{0}|^01.{1}|^[0-9]{3})-?([0-9]{3,4})-?([0-9]{4})$/;
var _receives = new Array();
var _uploadImage;
var _maxSize = 1000;
var _header = 'data:image/jpeg;base64,';
var _imgId = 'imgUpload';
var _imgBg;
$(function() {
$('#btnSubmitExcel').css({'opacity': '0.5'}).bind('click', function() {
alert('파일을 선택해 주세요.');
});
$('input[name=uploadFile]').fileupload({
url: '/web/mjon/msgdata/excelCallProc.do'
, dataType: 'json'
, autoUpload: false
, add: function(e, data) {
//console.log(data)
var sct = data.files[0].type || '';
if (sct.indexOf('spreadsheetml') > - 1 || sct.indexOf('ms-excel') > - 1) {
$('#spanFileName').text(data.files[0].name).removeClass('hide');
$('#btnSubmitExcel').css({'opacity': ''}).unbind('click').click(function() {
data.submit();
});
}
else {
$('#spanFileName').text('').addClass('hide');
$('#btnSubmitExcel').unbind('click').bind('click', function() {
alert('파일을 선택해 주세요.');
});
$('#btnSubmitExcel').css({'opacity': '0.5'});
alert('엑셀 파일만 업로드할 수 있습니다.');
}
}
, done: function(e, data) {
//console.log(data.result)
//data.result 리턴 객체
var result = data.result;
if (result.success) {
//전화번호 추가
if(result.data.length > _perSplice){
var part = getSplicedPart(result.data);
addPhone(part);
}else
addPhone(result.data);
$.colorbox.close();
}
else {
alert(result.message);
return;
}
}
, fail: function(e, data) {
alert('업로드 처리 중 오류가 발생했습니다.\n페이지를 새로고침(F5)한 후 다시 시도해 보시기 바랍니다.');
$.colorbox.close();
}
});
});
//수신번호 추가
//data : json 목록 데이터
// [{phone: '전화번호', name: '주소록이름', group: '주소록 그룹 이름', item2: '집/사무실', item3: '메모1', item4: '메모2', item5: '메모3'}, {...}]
function addPhone(data) {
var $ul = $('#ulReceives');
//한 개 수동 등록
if (data == null) {
var $txtPhone = $('#txtPhone');
if (!_regExp1.test($txtPhone.val())) {
alert('올바른 전화번호를 입력해야 합니다.');
return;
}
var obj = [{receive: '', name: '', group: '', item2: '', item3: '', item4: '', item5: ''}];
obj[0].receive = $txtPhone.val().replace(_regExp1, '$1-$2-$3');
//유무 판단
var isExist = false;
$ul.find('input:checkbox').each(function() {
if ($(this).attr('phoneNo') == obj[0].receive) {
isExist = true;
return false;
}
});
if (!isExist) {
var iCurrCount = $ul.find('li').length;
//$('#receiveTmpl').tmpl({data: obj, currCount: iCurrCount}).appendTo($ul);
$ul.append(makeTableRows(obj, iCurrCount));
$txtPhone.val('');
}
else
alert('이미 추가된 전화번호입니다.');
}
//json 목록 연계 등록
else {
var newData = new Array();
var phones = new Array();
var iSkipCnt = 0;
var idx = 0;
var $chks = $ul.find('input:checkbox');
$chks.each(function() {
phones.push($(this).attr('phoneNo'));
});
$.each(data, function(i, val) {
if ($.inArray(val.receive, phones) === -1) {
phones.push(val.receive);
newData.push(val);
}
else
++iSkipCnt;
});
// for (var x in data) {
// var isExist = false;
// $chks.each(function() {
// if ($(this).attr('phoneNo') == data[x].phone) {
// isExist = true;
// return false;
// }
// });
// if (!isExist)
// newData[idx++] = data[x];
// else
// ++iSkipCnt;
// }
try {
var iCurrCount = $ul.find('li').length;
$ul.append(makeTableRows(newData, iCurrCount));
if(_hasLeftCnt > 0)
$ul.append('<img id="loader" src="/images/loading_3_32.gif"/>');
if (iSkipCnt > 0)
alert(iSkipCnt + '개의 전화번호가 중복되어 생략되었습니다.');
}
catch(e) {
console.log(e);
alert('스크립트 오류가 발생했습니다.\n페이지를 새로고침(F5)한 후 다시 시도해 보시기 바랍니다.');
}
}
//$('#bTotalReceiveCnt').text(addComma($ul.find('li').length + _receives.length));
}
function getSplicedPart(data){
var len = data.length;
var part = data.splice(0, (len >= _perSplice) ? _perSplice : len);
_hasLeftCnt = data.length;
_receives = data;
return part;
}
function makeTableRows(json, currCnt) {
var sTemplate = '<li>'
+ '<input type="checkbox" name="receivePhone" id="receive_{idx}" phoneNo="{phone}" data-item=\'{item}\' />'
+ '<label for="receive_{idx}"><span class="num">{idx}.</span>{phone}</label>'
+ '</li>';
var sRtn = '';
var i = 0;
for (var x in json) {
//console.log(json[x])
sRtn += sTemplate.replace(/\{idx\}/g, currCnt + i + 1)
.replace(/\{phone\}/g, json[x].receive)
.replace(/\{item\}/g, JSON.stringify(json[x]));
i++;
}
var $rtn = $(sRtn);
/* $rtn.find('input[name=receivePhone]').each(function(i) {
$(this).data('item', json[i]);
}); */
return $rtn;
}
</script>