435 lines
13 KiB
JavaScript
435 lines
13 KiB
JavaScript
/**
|
|
*
|
|
* @author : 이호영
|
|
* @fileName : tabulator.js
|
|
* @date : 2023.02.21
|
|
* @description : tabulator 관련 js
|
|
* ===========================================================
|
|
* DATE AUTHOR NOTE
|
|
* ----------------------------------------------------------- *
|
|
* 2023.02.21 이호영 최초 생성
|
|
*
|
|
*
|
|
*
|
|
*/
|
|
var tableL = null;
|
|
$(document).ready(function (){
|
|
//받는사람 연락처 내용 처리
|
|
//Tabulator AJAX Data Loading
|
|
tableL = new Tabulator(".callList_box_P", {
|
|
height:"255px",
|
|
layout:"fitColumns",
|
|
headerHozAlign:"center",
|
|
validationMode:"highlight",
|
|
headerHozAlign:"center",
|
|
clipboard: true, // 클립보드 기능 활성화
|
|
clipboardPasteAction: "replace", // 붙여넣기 시 기존 데이터 교체 (또는 "update" 선택 가능)
|
|
validationMode:"highlight",
|
|
placeholder:"복사(Ctrl+C)한 내용을 여기에 붙여넣기(Ctrl+V) 해주세요.", //fit columns to width of table (optional)
|
|
resizableColumns:false,
|
|
clipboardPasteParser: function(clipboard){
|
|
const rows = clipboard.split("\n").filter(row => row.trim() !== "");
|
|
|
|
// 1. 붙여넣기 데이터 → 가공
|
|
const newData = rows
|
|
.map(row => {
|
|
const cols = row.split("\t");
|
|
const phoneRaw = cols[0].trim();
|
|
const phone = removeDash(phoneRaw);
|
|
return { phone };
|
|
})
|
|
.filter(row => checkHpNum(row.phone));
|
|
|
|
// 2. 기존 데이터 가져오기
|
|
const existingData = tableL.getData();
|
|
|
|
// 3. 기존 데이터 + 붙여넣은 데이터 합치기
|
|
const combinedData = existingData.concat(newData);
|
|
|
|
// 4. 중복 제거 + 갯수 카운트
|
|
const result = removeDuplicatesAndCount(combinedData, 'phone');
|
|
|
|
// 5. 외부 처리 함수 호출
|
|
setAllCntData(result);
|
|
fn_priceClclt();
|
|
|
|
// 6. 테이블에 반영할 데이터 리턴
|
|
return result;
|
|
},
|
|
columnDefaults:{ // 공통설정
|
|
hozAlign: "center",
|
|
headerHozAlign: "center",
|
|
editor: false
|
|
},
|
|
columns:[ //Define Table Columns
|
|
{formatter:"rowSelection", titleFormatter:"rowSelection", width:60, clipboard:false, hozAlign:"center", headerSort:false, cellClick:function(e, cell){
|
|
cell.getRow().toggleSelect();
|
|
}},
|
|
// {title:"이름", hozAlign:"center", field:"name", editor:"input", validator:["maxLength:12"], cellEdited:function(cell){
|
|
// //cell - cell component
|
|
// fnReplCell();
|
|
// }},
|
|
{title:"휴대폰", hozAlign:"center", field:"phone", editor:"input", validator:["required","minLength:10", "maxLength:12"], cellEdited:function(cell){
|
|
//cell - cell component
|
|
fnDuplPhone();
|
|
}},
|
|
]
|
|
|
|
});
|
|
|
|
//주소록 불러오기 팝업 내용
|
|
//Tabulator AJAX Data Loading
|
|
tableAddr = new Tabulator(".callAddr_box", {
|
|
height:"255px",
|
|
layout:"fitColumns",
|
|
headerHozAlign:"center",
|
|
validationMode:"highlight",
|
|
placeholder:"주소록 그룹을 선택해 주세요.", //fit columns to width of table (optional)
|
|
resizableColumns:false,
|
|
columns:[ //Define Table Columns
|
|
{formatter:"rowSelection", titleFormatter:"rowSelection",clipboard:false, hozAlign:"center", headerSort:false, width: 50, cellClick:function(e, cell){
|
|
cell.getRow().toggleSelect();
|
|
}
|
|
},
|
|
{title:"그룹명", hozAlign:"center", field:"addrGroupNm", widthGrow: 3, editor:"input", validator:["required","minLength:2", "maxLength:40"]},
|
|
{title:"이름", hozAlign:"center", field:"name", widthGrow: 2, editor:"input", validator:["maxLength:12"]},
|
|
{title:"휴대폰번호", hozAlign:"center", field:"phone", widthGrow: 3, editor:"input", validator:["required","minLength:10", "maxLength:11"]},
|
|
|
|
],
|
|
validationFailed:function(cell, value, parameters){ // 유효성 체크 함수 - 아직 잘 모르겠음
|
|
var valid = cell.isValid();
|
|
var fieldNm = cell.getField();
|
|
if(!valid){
|
|
if(fieldNm == "addrName"){
|
|
alert("받는사람 이름은 최대 12글자까지만 입력 가능합니다.");
|
|
}else if(fieldNm == "addrPhone"){
|
|
alert("휴대폰번호는 하이픈(-)을 제외한 숫자만 정확히 입력해 주세요.");
|
|
}else if(fieldNm == "addrGroupNm"){
|
|
alert("그룹명을 정확히 입력해 주세요. 2 ~ 40글자 이내로 입력 가능합니다.");
|
|
}
|
|
|
|
//해당 셀 데이터 삭제
|
|
cell.setValue("");
|
|
}
|
|
return value % parameters.addrPhone;
|
|
},
|
|
|
|
});
|
|
|
|
|
|
//받는사람 번호 버튼 클릭시 Tabulator에 데이터 넣어주기
|
|
$('.addCallToF').click(function(){
|
|
|
|
// checkHpNum(callToNum)
|
|
|
|
|
|
|
|
var textarea = $('#callTo');
|
|
const numbers = textarea.val().split('\n')
|
|
.map(num => removeDash(num.trim()))
|
|
.filter(num => num !== "")
|
|
.filter(num => checkHpNum(num)); // 유효한 번호만 필터링;
|
|
|
|
|
|
|
|
const formattedData = numbers.map(num => ({phone: num}));
|
|
|
|
// 기존 tableL의 데이터를 가져옵니다.
|
|
var existingData = tableL.getData();
|
|
// 기존 데이터와 새로운 데이터를 합칩니다.
|
|
var combinedData = existingData.concat(formattedData);
|
|
|
|
// @ phone을 기준으로 중복 제거 및 갯수 계산
|
|
const result = removeDuplicatesAndCount(combinedData, 'phone');
|
|
|
|
setAllCntData(result);
|
|
|
|
textarea.val('');
|
|
fn_priceClclt();
|
|
});
|
|
|
|
|
|
//받는사람 전체삭제 버튼 처리
|
|
$('.all_del').click(function(){
|
|
|
|
var data = tableL.getRows();
|
|
|
|
if(data == null || data == ""){
|
|
|
|
alert("받는사람을 추가해 주세요.");
|
|
return false;
|
|
|
|
}else{
|
|
|
|
if(confirm("받는사람 목록을 모두 삭제하시겠습니까?")){
|
|
tableL.clearData();
|
|
$("#rowTotCnt").text(0); //총건수 수정
|
|
$("#rowDupCnt").text(0); //중복건수 수정
|
|
totalPriceSum(0); //결제 금액 수정
|
|
}
|
|
|
|
}
|
|
|
|
});
|
|
|
|
|
|
|
|
//주소록 불러오기 버튼 클릭시
|
|
$('.popupAddr').click(function(){
|
|
|
|
var login = '${LoginVO.id}';
|
|
|
|
if(login == null || login == ''){
|
|
|
|
alert("로그인 후 이용이 가능합니다.");
|
|
return false;
|
|
|
|
}
|
|
|
|
$("#addrGroupLoad").load("/web/mjon/msgdata/selectAddrGroupListAjax.do", "" ,function(response, status, xhr){
|
|
//리스트 스크롤 처리해주기
|
|
$(".adr_pop_list").mCustomScrollbar({
|
|
axis: 'y',
|
|
scrollbarPosition: "outside",
|
|
theme: "dark",
|
|
autoHideScrollbar: false
|
|
});
|
|
});
|
|
|
|
});
|
|
|
|
|
|
//엑섹불러오기 버튼 클릭시 파일 첨부 실행
|
|
$('.upImg').click(function(){ // 엑셀파일 불러오기 선택 시
|
|
|
|
$("#imgFile").click();
|
|
|
|
});
|
|
|
|
//최근전송내역 팝업 선택추가 버튼 처리(체크내역 받는사람 리스트로 추가해주기)
|
|
$(document).on('click', '#latestAddPhone', function (){
|
|
|
|
var addPhoneList = [];
|
|
|
|
$("input:checkbox[name='latAddrChk']:checked").each(function(){
|
|
var chkPhone = $(this).val().trim();
|
|
|
|
console.log('b chkPhone: ', chkPhone);
|
|
if(!checkHpNum(chkPhone)){
|
|
// alert("올바른 전화번호가 아닙니다.");
|
|
return false;
|
|
}
|
|
// console.log('a chkPhone: ', chkPhone);
|
|
addPhoneList.push(chkPhone);
|
|
});
|
|
|
|
if(addPhoneList.length < 1) {
|
|
alert("연락처를 선택해주세요.");
|
|
return false;
|
|
}
|
|
|
|
|
|
// 1. 기존 로직: 연락처 추가 처리
|
|
// addPhoneInfo(addPhoneList);
|
|
|
|
// 2. Tabulator에 넣기 위한 포맷 변환
|
|
const formattedData = addPhoneList.map(num => ({phone: num}));
|
|
|
|
// 3. 기존 테이블 데이터와 합치기
|
|
const existingData = tableL.getData();
|
|
const combinedData = existingData.concat(formattedData);
|
|
|
|
// 4. 중복 제거
|
|
const result = removeDuplicatesAndCount(combinedData, 'phone');
|
|
|
|
// console.log('result: ', result);
|
|
// 5. 테이블에 반영
|
|
// tableL.setData(result);
|
|
|
|
// 6. 수량/가격 계산
|
|
setAllCntData(result);
|
|
fn_priceClclt();
|
|
|
|
// 7. 팝업 닫기
|
|
$("#btnLatestAddPhoneClose").trigger("click");
|
|
|
|
|
|
});
|
|
|
|
//최근전송내역 팝업 선택 취소 버튼 처리
|
|
$(document).on('click', '#latestCancelPhone', function (){
|
|
|
|
$("input[name=latAddrChk]").prop("checked", false);
|
|
|
|
});
|
|
|
|
//최근전송내역 팝업 삭제 버튼 처리
|
|
$(document).on('click', '#latestAddrDel', function (){
|
|
|
|
$(this).parent("#latestLi").remove();
|
|
|
|
});
|
|
|
|
//자주보내는 번호 팝업 선택추가 버튼 처리(체크내역 받는사람 리스트로 추가해주기)
|
|
$(document).on('click', '#bookMarkAddPhone', function (){
|
|
|
|
var addPhoneList = []; //신규로 추가할 전화번호 저장변수
|
|
|
|
$("input:checkbox[name='bookAddrChk']:checked").each(function(index){
|
|
|
|
var chkPhone = $(this).val();
|
|
|
|
if(!checkHpNum(chkPhone)){
|
|
|
|
alert("올바른 전화번호가 아닙니다.");
|
|
return false;
|
|
|
|
}else{
|
|
|
|
addPhoneList.push({phone: removeDash(chkPhone.trim())});
|
|
|
|
}
|
|
|
|
});
|
|
|
|
if(addPhoneList.length > 0){
|
|
//연락처 추가해 주기
|
|
addPhoneInfo(addPhoneList);
|
|
$("#btnLatestAddPhoneClose").trigger("click");
|
|
}
|
|
else {
|
|
alert("연락처를 선택해주세요.");
|
|
return false;
|
|
}
|
|
|
|
//중복연락처 제거
|
|
//var removeDuplData = dupliPhoneData(addPhoneList);
|
|
|
|
//받는사람 목록에 추가
|
|
//tableL.addData(removeDuplData);
|
|
|
|
//총 받는사람 수 계산
|
|
//totRows = tableL.getRows().length;
|
|
//updateTotCnt(totRows);
|
|
|
|
//결제 금액 구하기
|
|
//totalPriceSum(totRows);
|
|
|
|
});
|
|
|
|
//자주보내는 번호 팝업 선택 취소 버튼 처리
|
|
$(document).on('click', '#bookMarkCancelPhone', function (){
|
|
|
|
$("input[name=bookAddrChk]").prop("checked", false);
|
|
|
|
});
|
|
|
|
//자주보내는 번호 팝업 삭제 버튼 처리
|
|
$(document).on('click', '#bookMarkAddrDel', function (){
|
|
|
|
$(this).parent("#bookMarkLi").remove();
|
|
|
|
});
|
|
|
|
// 자주보내는 번호 팝업 닫기 버튼 처리
|
|
$(document).on('click', '#btnLatestAddPhoneClose', function (){
|
|
// 자주보내는 번호 체크박스 해제처리
|
|
setCheckBoxUnChecked();
|
|
});
|
|
|
|
// 자주보내는 번호 체크박스 해제처리
|
|
function setCheckBoxUnChecked() {
|
|
$("input[name=latAddrChk]").prop("checked", false);
|
|
$("input[name=bookAddrChk]").prop("checked", false);
|
|
}
|
|
|
|
|
|
});
|
|
|
|
var tableErrorData = [];
|
|
var totRows = 0; // 좌측 받는사람 총 갯수
|
|
|
|
|
|
/*
|
|
* 토탈 카운트 화면에 노출
|
|
* 변수 없는 리스트만 체크
|
|
*/
|
|
function updateTotCnt(cnt){
|
|
|
|
$("#rowTotCnt").text(cnt);
|
|
|
|
}
|
|
|
|
//주소록 불러오기에서 수신자 리스트 화면에 추가해주기
|
|
function addPhoneInfo(taData){
|
|
|
|
if(taData == null){
|
|
alert("연락처 정보가 없습니다.");
|
|
return;
|
|
}
|
|
|
|
// if(taData.length > 500){
|
|
// alert("최대 발송 건수는 500건 입니다.");
|
|
// return;
|
|
// }
|
|
|
|
|
|
/*
|
|
* 주소록 데이터 화면에 추가
|
|
*/
|
|
this.fn_displayJsonToHtmlTable(taData);
|
|
|
|
/*
|
|
* 토탈 카운트 화면에 노출
|
|
*/
|
|
this.updateTotCnt();
|
|
|
|
}
|
|
|
|
/*
|
|
* 주소록 데이터 화면에 추가
|
|
*/
|
|
function fn_displayJsonToHtmlTable(taData){
|
|
|
|
// fn_viewDataInit01();
|
|
// 치환문자가 있으면 데이터 초기화
|
|
|
|
|
|
var $htmlBody = $('#wrap01_body');
|
|
|
|
var addHtml = '<div class="list_table list_body excelBody01">'
|
|
+'\t<div class="cb_wrap">'
|
|
+'\t\t<label for="" class="label"></label>'
|
|
+'\t\t<input type="checkbox" class="wrap01C">'
|
|
+'\t</div>'
|
|
+'\t<div class="list_table_num phoneArea">'
|
|
+'\t\t<p>$PHONE$</p>'
|
|
+'\t</div>'
|
|
/*23.04.06 이름제거 요청으로인한 화면 이름 제거*/
|
|
/*+'\t<div class="list_table_name">'
|
|
+'\t\t<p>$NAME$</p>'
|
|
+'\t</div>'*/
|
|
+'</div>';
|
|
|
|
|
|
|
|
|
|
var totalDuplCnt = $('#rowDupCnt').text();
|
|
|
|
var itemPhone;
|
|
var itemName;
|
|
$.each(taData, function(index, item){
|
|
itemPhone = item.phone;
|
|
itemName = item.name;
|
|
// == null ? '': item.name;
|
|
if(!phoneDupl(itemPhone))
|
|
/*23.04.06 이름제거 요청으로인한 화면 이름 제거*/
|
|
// $htmlBody.append(addHtml.replace('$PHONE$', itemPhone).replace('$NAME$', itemName ??= ''));
|
|
$htmlBody.append(addHtml.replace('$PHONE$', itemPhone));
|
|
else
|
|
totalDuplCnt++;
|
|
});
|
|
$('#rowDupCnt').text(totalDuplCnt);
|
|
}
|
|
|