jaybe/adsManager
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity
Files
master
adsManager/app/Views/integrate/DBintegrated.php
T
Jaybe 247a7808d3 init
2025-03-05 14:02:29 +09:00

858 lines
36 KiB
PHP
Raw Permalink Blame History

<?=$this->extend('templates/front.php');?>
<!--타이틀-->
<?=$this->section('title');?>
ZENITH - 통합 DB 관리
<?=$this->endSection();?>
<!--헤더-->
<?=$this->section('header');?>
<link href="/static/css/datatables.css" rel="stylesheet">
<script src="/static/node_modules/datatables.net/js/dataTables.min.js"></script>
<script src="/static/node_modules/datatables.net-buttons/js/dataTables.buttons.min.js"></script>
<script src="/static/node_modules/datatables.net-buttons/js/buttons.html5.js"></script>
<script src="/static/node_modules/datatables.net-buttons/js/buttons.colVis.min.js"></script>
<script src="/static/node_modules/datatables.net-staterestore/js/dataTables.stateRestore.min.js"></script>
<script src="/static/node_modules/datatables.net-fixedheader/js/dataTables.fixedHeader.min.js"></script>
<script src="/static/node_modules/datatables.net-fixedcolumns/js/dataTables.fixedColumns.min.js"></script>
<script src="/static/node_modules/datatables.net-keytable/js/dataTables.keyTable.min.js"></script>
<!-- bootstrap5 -->
<link href="/static/node_modules/datatables.net-bs5/css/dataTables.bootstrap5.min.css" rel="stylesheet">
<link href="/static/node_modules/datatables.net-buttons-bs5/css/buttons.bootstrap5.min.css" rel="stylesheet">
<link href="/static/node_modules/datatables.net-staterestore-bs5/css/stateRestore.bootstrap5.min.css" rel="stylesheet">
<link href="/static/node_modules/datatables.net-fixedheader-bs5/css/fixedHeader.bootstrap5.min.css" rel="stylesheet">
<link href="/static/node_modules/datatables.net-fixedcolumns-bs5/css/fixedColumns.bootstrap5.min.css" rel="stylesheet">
<link href="/static/node_modules/datatables.net-keytable-bs5/css/keyTable.bootstrap5.min.css" rel="stylesheet">
<script src="/static/node_modules/datatables.net-bs5/js/dataTables.bootstrap5.min.js"></script>
<script src="/static/node_modules/datatables.net-buttons-bs5/js/buttons.bootstrap5.min.js"></script>
<script src="/static/node_modules/datatables.net-staterestore-bs5/js/stateRestore.bootstrap5.min.js"></script>
<script src="/static/node_modules/datatables.net-fixedheader-bs5/js/fixedHeader.bootstrap5.min.js"></script>
<script src="/static/node_modules/datatables.net-fixedcolumns-bs5/js/fixedColumns.bootstrap5.min.js"></script>
<script src="/static/node_modules/datatables.net-keytable-bs5/js/keyTable.bootstrap5.min.js"></script>
<script src="/static/js/jquery.number.min.js"></script>
<script src="/static/node_modules/jszip/dist/jszip.min.js"></script>
<script src="/static/js/pdfmake/pdfmake.min.js"></script>
<script src="/static/js/pdfmake/vfs_fonts.js"></script>
<style>
.memo-all{text-align:right;}
.sub-contents-wrap table.dataTable th.dt-type-center,
.sub-contents-wrap table.dataTable td.dt-type-center {text-align:center;}
.table-responsive .dt-search {justify-content:flex-start;}
.btns-memo-style {top:5px;}
</style>
<?=$this->endSection();?>
<!--바디-->
<?=$this->section('body');?>
<?=$this->endSection();?>
<?=$this->section('content');?>
<div class="sub-contents-wrap db-manage-contaniner">
<div class="title-area">
<h2 class="page-title">통합 DB 관리</h2>
<!-- <p class="title-disc">안하는 사람은 끝까지 할 수 없지만, 못하는 사람은 언젠가는 해 낼 수도 있다.</p> -->
</div>
<div class="search-wrap type-single">
<form name="search-form" autocomplete='off' class="search d-flex justify-content-center">
<div class="term term-small d-flex align-items-center">
<input type="hidden" name="sdate" id="sdate"><input type="hidden" name="edate" id="edate">
<label><input type="text" name="dates" id="dates" data="daterangepicker" autocomplete="off" aria-autocomplete="none"><i class="bi bi-calendar2-week"></i></label>
</div>
<div class="input">
<button class="btn-primary" id="search_btn" type="submit">조회</button>
</div>
</form>
</div>
<div class="section reset-btn-wrap">
<div class="reset-btn-box">
<button type="button" class="reset-btn">필터 초기화</button>
</div>
</div>
<?php if(getenv('MY_SERVER_NAME') === 'resta' && auth()->user()->inGroup('superadmin', 'admin', 'developer', 'user')){?>
<div class="section client-list">
<h3 class="content-title toggle"><i class="bi bi-chevron-up"></i> 분류</h3>
<div class="row" id="company-list"></div>
</div>
<?php }?>
<?php if(auth()->user()->hasPermission('integrate.advertiser') || auth()->user()->inGroup('superadmin', 'admin', 'developer', 'user', 'agency')){?>
<div class="section client-list mt20">
<h3 class="content-title toggle"><i class="bi bi-chevron-up"></i> 광고주</h3>
<div class="row" id="advertiser-list"></div>
</div>
<?php }?>
<?php if(auth()->user()->hasPermission('integrate.media') || auth()->user()->inGroup('superadmin', 'admin', 'developer', 'user', 'agency')){?>
<div class="section client-list">
<h3 class="content-title toggle"><i class="bi bi-chevron-up"></i> 매체</h3>
<div class="row" id="media-list"></div>
</div>
<?php }?>
<?php if(auth()->user()->hasPermission('integrate.description') || auth()->user()->inGroup('superadmin', 'admin', 'developer', 'user', 'agency')){?>
<div class="section client-list">
<h3 class="content-title toggle"><i class="bi bi-chevron-up"></i> 이벤트 구분</h3>
<div class="row" id="description-list"></div>
</div>
<?php }?>
<div>
<div class="search-wrap my-5 status_wrap">
<div class="statusCount detail d-flex minWd"></div>
</div>
<div class="table-responsive db-table-responsive">
<div class="btns-memo-style">
<span class="btns-title">메모 표시:</span>
<button type="button" class="btns-memo" value="modal" title="새창으로 표시"><i class="bi bi-window-stack"></i></button>
<button type="button" class="btns-memo" value="table" title="테이블에 표시"><i class="bi bi-table"></i></button>
<button type="button" class="btns-memo" value="all" title="한번에 표시"><i class="bi bi-eye"></i></button>
</div>
<table class="dataTable table table-default deviceTable" id="deviceTable">
<thead class="table-dark">
<tr>
<th class="first">#</th>
<?php if(getenv('MY_SERVER_NAME') === 'resta' && auth()->user()->inGroup('superadmin', 'admin', 'developer', 'user')){?>
<th>분류</th>
<?php }?></php>
<th>이벤트</th>
<?php if(auth()->user()->hasPermission('integrate.advertiser') || auth()->user()->inGroup('superadmin', 'admin', 'developer', 'user')){?>
<th>광고주</th>
<?php }?>
<?php if(auth()->user()->hasPermission('integrate.media') || auth()->user()->inGroup('superadmin', 'admin', 'developer', 'user')){?>
<th>매체</th>
<?php }?>
<?php if(auth()->user()->hasPermission('integrate.description') || auth()->user()->inGroup('superadmin', 'admin', 'developer', 'user')){?>
<th>이벤트 구분</th>
<?php }?>
<th>이름</th>
<th>전화번호</th>
<th>나이</th>
<th>성별</th>
<th>기타</th>
<th>사이트</th>
<th>등록일</th>
<th>메모</th>
<th class="last">인정기준</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
</div>
<!-- 개별 메모 -->
<div class="modal fade" id="modal-integrate-memo" tabindex="-1" aria-labelledby="modal-integrate-memo-label" aria-hidden="true">
<div class="modal-dialog modal-sm sm-txt">
<div class="modal-content">
<div class="modal-header">
<h1 class="modal-title" id="modal-integrate-memo-label"><i class="bi bi-file-text"></i> 개별 메모<span class="title"></span></h1>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<form class="regi-form">
<fieldset>
<legend>메모 작성</legend>
<textarea></textarea>
<button type="button" class="btn-regi">작성</button>
</fieldset>
</form>
<ul class="memo-list m-2"></ul>
</div>
</div>
</div>
</div>
<!-- //개별 메모 -->
</div>
</div>
<?=$this->endSection();?>
<!--스크립트-->
<?=$this->section('script');?>
<script>
let active_status;
$('#sdate, #dates').val(moment().format('YYYY-MM-DD')); // 오늘 날짜를 입력 필드에 설정
$('#edate').val(moment().format('YYYY-MM-DD')); // 오늘 날짜를 입력 필드에 설정
jQuery.fn.dataTable.ext.type.search.select = function(data) {
// data가 select 요소인지 확인
if (typeof data === 'string' && data.indexOf('<select') !== -1) {
// jQuery를 사용하여 select 요소를 파싱하고 선택된 옵션의 텍스트를 가져옴
var select = $(data);
var selectedText = select.find('option:selected').text();
return selectedText ? selectedText : '';
}
return data;
};
var lead_status = {"1":"인정", "2":"중복", "3":"성별불량", "4":"나이불량", "5":"콜불량", "6":"번호불량", "7":"테스트", "8":"이름불량", "9":"지역불량", "10":"업체불량", "11":"미성년자", "12":"본인아님", "13":"쿠키중복", "99":"확인"};
let dataTable = $('.dataTable').DataTable({
"dom": '<fr<t>ip>', // DataTables의 DOM 구조 설정
"fixedHeader": {
"header" : true, // 헤더 고정
"footer" : true, // 푸터 고정
},
"autoWidth": true, // 자동 너비 조정 활성화
"processing" : true, // 처리 중 표시 활성화
"serverSide" : false, // 서버 사이드 처리 비활성화
"responsive": true, // 반응형 테이블 활성화
"searching": true, // 검색 기능 활성화
"order": [[0, "desc"]], // seq 항목을 역순 정렬
"ordering": true, // 정렬 기능 활성화
"orderMulti": false, // 다중 열 정렬 활성화
"orderCellsTop": false, // 열 헤더 클릭 시 정렬 활성화
"paging": true, // 페이징 비활성화
"pageLength": 25, // 페이지당 표시할 행 수
"info": false, // 정보 표시 비활성화
"scroller": false, // 스크롤러 비활성화
"scrollX": true, // 가로 스크롤 활성화
"stateSave": true, // 상태 저장 활성화
"deferRender": false, // 렌더링 지연 비활성화
"rowId": "seq",
"language": {"url": '/static/js/dataTables.i18n.json'}, //한글화 파일
"ajax": {
"url": "<?=base_url()?>/integrate/list", // AJAX URL 설정
"type": "POST", // HTTP 요청 방식 설정
"data": function(d) {
d.date = {
sdate: $('#sdate').val(), // 시작 날짜
edate: $('#edate').val() // 종료 날짜
};
},
"dataSrc": function(json) {
if (json && json.data) {
setFilter(json.data);
}
return json.data;
}
},
"columnDefs": [
<?php
$target = 10;
if(getenv('MY_SERVER_NAME') === 'resta'
&& auth()->user()->inGroup('superadmin', 'admin', 'developer', 'user')) {
++$target;
}
if(auth()->user()->hasPermission('integrate.advertiser')
|| auth()->user()->inGroup('superadmin', 'admin', 'developer', 'user')){
++$target;
}
if(auth()->user()->hasPermission('integrate.media')
|| auth()->user()->inGroup('superadmin', 'admin', 'developer', 'user')){
++$target;
}
if(auth()->user()->hasPermission('integrate.description')
|| auth()->user()->inGroup('superadmin', 'admin', 'developer', 'user')){
++$target;
}
?>
{ type: "select", target: <?php echo $target;?> }, // 13은 status 컬럼의 인덱스입니다. 필요에 따라 조정하세요.
],
"columns": [
{ "data": "seq", "width": "4%", "className": "dt-type-center" },
<?php if(getenv('MY_SERVER_NAME') === 'resta' && auth()->user()->inGroup('superadmin', 'admin', 'developer', 'user')){?>
{ "data": null, "render": function(data, type, row) {
return row.company;
}
},
<?php }?>
{ "data": "info_seq","width": "4%", "className": "dt-type-center", "render": function(data, type, row) {
ico = '';
if(row.another_url == 1) ico = `<span class="another_url">🐢</span>`;
return data?ico+'<a href="'+row.event_url+'" target="event_pop">'+data+'</a>':'';
}
},
<?php if(auth()->user()->hasPermission('integrate.advertiser') || auth()->user()->inGroup('superadmin', 'admin', 'developer', 'user')){?>
{ "data": "advertiser","width": "7%", "className": "dt-type-center"},
<?php }?>
<?php if(auth()->user()->hasPermission('integrate.media') || auth()->user()->inGroup('superadmin', 'admin', 'developer', 'user')){?>
{ "data": "media", "className": "dt-type-center" },
<?php }?>
<?php if(auth()->user()->hasPermission('integrate.description') || auth()->user()->inGroup('superadmin', 'admin', 'developer', 'user')){?>
{ "data": "description","width":"10%", "className": "dt-type-center","render": function(data) {
return `<div class="mw10">${data}</div>`
}
},
<?php }?>
{ "data": "name", "width": "5%", "className": "dt-type-center", "render": function(data) {
return '<span style="display:inline-block;width:50px;max-height:15px;overflow:hidden" title="'+$(`<span>${data}</span>`).text()+'">'+(data ? data : '')+'</span>';
}
},
{ "data": "dec_phone","width":"8%", "className": "dt-type-center","render": function(data) {
return `<div class="mw10">${data}</div>`
}
},
{ "data": "age", "width": "3%", "className": "dt-type-center" },
{ "data": "gender", "width": "3%" },
{ "data": "add","render": function(data) {
return `<div class="mw10">${data}</div>`
}
},
{ "data": "site","width":"6%", "className": "dt-type-center" },
{ "data": "reg_date","width":"6%", "className": "dt-type-center","render": function(data) {
return `<div class="mw10">${data}</div>`
}
},
{ "data": "memo_cnt", "className": "memo","width":"3%", "className": "dt-type-center", "render" : function(data) { // data-bs-toggle="modal"
var html = '<button class="btn_memo text-dark position-relative" data-bs-target="#modal-integrate-memo"><i class="bi bi-chat-square-text h4"></i>';
html += '<span class="position-absolute top--10 start-100 translate-middle badge rounded-pill bg-danger badge-'+data+'">'+data+'</span>';
html += '</button>';
return html;
}
},
{
"data": 'status',"width":"6%", "render": function (data, type, row) {
<?php if(auth()->user()->hasPermission('integrate.status') || auth()->user()->inGroup('superadmin', 'admin')) { ?>
return `
<select class="lead-status form-select form-select-sm data-del">
${Object.keys(lead_status).map(key => `
<option value="${key}" ${data == key ? "selected" : ""}>${lead_status[key]}</option>
`).join('')}
</select>
`;
<?php } else { ?>
return `${lead_status[data] || ''}`;
<?php } ?>
}
},
],
"rowCallback": function(row, data) {
},
"stateSaveParams": function(settings, data) {
// memoState를 저장 데이터에 추가
data.memoState = settings.oInit.memoState;
// folded 상태 저장
data.foldedStates = settings.oInit.foldedStates;
},
"stateLoadParams": function(settings, data) {
// 저장된 memoState를 불러와서 settings에 추가
if (data.memoState) {
settings.oInit.memoState = data.memoState;
}
if (data.foldedStates) {
settings.oInit.foldedStates = data.foldedStates;
}
},
"initComplete": function(settings, json) {
// foldedStates 복원
if (settings.oInit.foldedStates) {
$('.client-list > .content-title').each(function(index) {
if (settings.oInit.foldedStates[index]) {
$(this).addClass('folded');
} else {
$(this).removeClass('folded');
}
});
}
// memoState 복원
let savedMemoState = settings.oInit && settings.oInit.memoState ? settings.oInit.memoState : 'modal';
$(`.btns-memo[value="${savedMemoState}"]`).addClass('active');
if (savedMemoState === 'all') displayAllMemos();
updateFilterButtons.call(this);
},
"drawCallback": function(settings) {
updateFilterButtons.call(this);
updateStatusCount.call(this);
if ($('.btns-memo.active').val() === 'all') {
debouncedDisplayAllMemos();
}
//통합DB 확인 시 테스트일 경우 표기 추가 240724
$('#deviceTable td.dt-type-center span').each(function() {
if ($(this).text().includes('테스트') || $(this).text().includes('test')) {
$(this).closest('tr').addClass('on');
}
});
},
});
var windowWidth = $(window).width();
if (windowWidth >= 1024) { // 태블릿 이상의 너비에서만 fixedColumns 적용
new $.fn.dataTable.FixedColumns(dataTable, {
leftColumns: 5, // 왼쪽에서 고정할 컬럼 수
rightColumns: 0 // 오른쪽에서 고정할 컬럼 수
});
}
// Debounce 함수 정의
function debounce(func, wait) {
let timeout;
return function(...args) {
clearTimeout(timeout);
timeout = setTimeout(() => func.apply(this, args), wait);
};
}
const debouncedDisplayAllMemos = debounce(displayAllMemos, 1000);
// 필터 버튼 업데이트 함수
function updateFilterButtons() {
var api = this.api(); // DataTables API 인스턴스를 가져옵니다.
var data = api.rows({ search: 'applied' }).data().toArray(); // 현재 페이지의 데이터를 배열로 변환합니다.
let uniqueValues = { advertiser: [], media: [], description: [] }; // 고유 값 저장을 위한 객체 초기화
var columnToListMap = {
'company': 'company-list',
'advertiser': 'advertiser-list',
'media': 'media-list',
'description': 'description-list'
};
// 필터링 상태에 따라 버튼에 active 클래스 적용
dataTable.columns().every(function() {
var column = this;
var search = column.search();
if (search) {
if(typeof search == 'function') return true;
var searchRegex = new RegExp(search.replace(/\\/g, ''));
var expectedListId = columnToListMap[column.dataSrc()];
if (expectedListId) {
$(`#${expectedListId} .filter_btn`).each(function() {
var btnValue = $.trim($(this).text());
if (searchRegex.test(btnValue)) {
$(this).addClass('active');
}
});
}
}
});
// 각 행의 데이터를 순회하면서 고유 값 배열에 추가합니다.
data.forEach(row => {
['advertiser', 'media', 'description'].forEach(key => {
if (!uniqueValues[key].includes(row[key])) { // 배열에 정확히 일치하는 값이 없으면 추가
uniqueValues[key].push(row[key]);
}
});
});
// 데이터 수량 계산 (status가 '인정'인 것만 카운트)
let countMap = { advertiser: {}, media: {}, description: {} };
api.rows({ search: 'applied' }).data().each(function(row) {
['advertiser', 'media', 'description'].forEach(key => {
let value = row[key];
if (row['status'] == '1' && typeof value === 'string') {
if(value == "") value = 'empty';
countMap[key][value] = (countMap[key][value] || 0) + 1;
}
});
});
// 수량 업데이트
Object.keys(countMap).forEach(key => {
let $list = $(`#${key}-list`);
if ($list.length) { // 요소가 존재하는지 확인
$list.find('.filter_btn').each(function() {
var btnValue = $(this).val();
if(btnValue == "") btnValue = 'empty';
var count = countMap[key][btnValue] || "";
$(this).siblings('.progress').find('.txt').text(count);
});
}
});
// 활성화된 필터 버튼이 없는 경우, 모든 필터 버튼의 'on' 클래스를 제거하고 함수를 종료합니다.
if (!$('.filter_btn.active').length) {
$('.filter_btn').removeClass('on');
return;
}
// 각 필터 유형에 대해 'on' 클래스를 토글합니다.
Object.keys(uniqueValues).forEach(key => {
let $list = $(`#${key}-list`);
if ($list.length) { // 요소가 존재하는지 확인
$list.find('.filter_btn').not('.active').each(function() {
var btnText = $(this).text().trim();
var isExactMatch = uniqueValues[key].some(function(value) { // 완전 일치 여부를 확인합니다.
return value === btnText;
});
$(this).toggleClass('on', isExactMatch); // 'on' 클래스를 토글합니다.
});
}
});
}
// 필터 버튼 세팅 함수
function setFilter(data) {
const unique = (prop) => [...new Set(data.map(item => item[prop]))];
const filters = {
media: unique('media'),
advertiser: unique('advertiser'),
description: unique('description'),
company: unique('company')
};
Object.keys(filters).forEach(type => {
let $row = $(`#${type}-list`);
let html = filters[type].map(v => `
<div class="col">
<div class="inner">
<button type="button" value="${v}" data-btn="${type}" class="${type}_btn filter_btn">
<span class="account_name">${v}</span>
</button>
<div class="progress">
<div class="txt">0</div>
</div>
</div>
</div>
`).join('');
$row.html('').append(html);
// 정렬
let buttons = $row.find('.filter_btn').toArray();
buttons.sort((a, b) => $(a).find('.account_name').text().localeCompare($(b).find('.account_name').text(), 'en', { sensitivity: 'base' }));
buttons.forEach(button => $row.append(button.parentNode.parentNode));
});
}
// statusCount 업데이트 함수
function updateStatusCount() {
var api = this.api(); // DataTables API 인스턴스를 가져옵니다.
let statusCountMap = {};
// active_status 값으로 .statusCount dl dt 텍스트 찾아서 클래스 추가
if(typeof active_status != 'undefined') {
$('.statusCount dl dt').each(function() {
if ($(this).text() === lead_status[active_status]) {
$(this).closest('dl').addClass('active');
}
});
return;
}
api.rows({ search: 'applied' }).data().each(function(row) {
let status = row['status'];
if (status) {
statusCountMap[status] = (statusCountMap[status] || 0) + 1;
}
});
let statusHtml = Object.keys(lead_status).map(status => `
<dl class="col" data-status="${status}">
<dt>${lead_status[status]}</dt>
<dd>${statusCountMap[status] || 0}</dd>
</dl>
`).join('');
$('.statusCount').html(statusHtml);
// dl 클릭 이벤트 바인딩
$('.statusCount dl').on('click', function() {
var statusColumnIndex = getColumnIndexByHeader('status');
if ($(this).hasClass('active')) {
$(this).removeClass('active');
active_status = undefined;
dataTable.column(statusColumnIndex).search('').draw();
} else {
$('.statusCount dl').removeClass('active');
$(this).addClass('active');
let status = $(this).data('status');
active_status = status;
dataTable.column(statusColumnIndex).search((d) => {return d == lead_status[status]}).draw();
}
});
}
// 컬럼 인덱스 가져오기
function getColumnIndexByHeader(dataName) {
var index = -1;
dataTable.settings().init().columns.forEach(function(column, i) {
if (column.data === dataName) {
index = i;
return false; // 반복문 종료
}
});
return index;
}
// 상태 변경 이벤트
$(document).on('change', '.lead-status', function() {
var $select = $(this);
var $row = $select.closest('tr');
var seq = $row.attr('id');
var oldStatus = dataTable.row($row).data().status;
var newStatus = $select.val();
$.ajax({
url: '<?=base_url()?>/integrate/setstatus',
type: 'POST',
data: {
seq: seq,
oldstatus: oldStatus,
status: newStatus
},
success: function(response) {
// 성공 시 처리할 내용
console.log('Status updated successfully');
// 메모 저장
var memo = `인정기준 변경(${lead_status[oldStatus]} > ${lead_status[newStatus]})`;
saveMemo(memo, seq, $row);
},
error: function(xhr, status, error) {
// 에러 시 처리할 내용
console.error('Error updating status:', error);
}
});
});
// 메모 가져오기
function fetchMemo(seq, callback) {
$.ajax({
url: '<?=base_url()?>/integrate/getmemo',
type: 'GET',
data: { seq: seq },
success: function(response) {
callback(response);
},
error: function(xhr, status, error) {
console.error('Error fetching memo:', error);
}
});
}
// 메모 표시
function displayMemo(memoList, displayType, $row = null) {
var memoContent = '';
if (Array.isArray(memoList)) {
memoContent = memoList.map(function(memo) {
return `
<div class="memo-item">
<div class="memo-body">
<p>${memo.memo}</p>
</div>
<div class="memo-header">
<strong>${memo.username}</strong>
<span class="memo-date">${memo.reg_date}</span>
</div>
</div>
`;
}).join('');
}
if (displayType === 'modal') {
var $memoListContainer = $('#modal-integrate-memo .memo-list');
$memoListContainer.empty().append(memoContent);
$('#modal-integrate-memo').data('leads-seq', $row.attr('id')); // leads_seq 저장
// 이름 컬럼의 인덱스를 동적으로 찾기
var nameColumnIndex = getColumnIndexByHeader('name');
if (nameColumnIndex !== -1) {
var name = $row.find('td').eq(nameColumnIndex).text(); // 이름이 있는 열의 인덱스를 사용하여 이름을 가져옴
$('#modal-integrate-memo-label').html(`<i class="bi bi-file-text"></i> 개별 메모 - ${name}`);
} else {
$('#modal-integrate-memo-label').html(`<i class="bi bi-file-text"></i> 개별 메모`);
}
$('#modal-integrate-memo').modal('show');
} else if ((displayType === 'table' || displayType === 'all') && $row) {
var memoForm = `
<form class="regi-form">
<fieldset>
<legend>메모 작성</legend>
<textarea></textarea>
<button type="button" class="btn-regi">작성</button>
</fieldset>
</form>
`;
if ($row.next().hasClass('memo-row')) {
$row.next().remove();
} else {
$row.after(`<tr class="memo-row"><td class="pl10 pr10" colspan="15">${memoForm}${memoContent}</td></tr>`);
}
}
}
// 모든 메모 표시
function displayAllMemos() {
$('.btn_memo').each(function() {
var $row = $(this).closest('tr');
var seq = $row.attr('id');
var badgeCount = $(this).find('.badge').text();
if (badgeCount > 0) {
fetchMemo(seq, function(memoList) {
displayMemo(memoList, 'table', $row);
});
}
});
}
// 메모 저장 함수
function saveMemo(memo, leads_seq, $form, $row) {
$.ajax({
url: '<?=base_url()?>/integrate/addmemo',
type: 'POST',
data: {
memo: memo,
leads_seq: leads_seq
},
success: function(response) {
// 메모 추가 후 폼 초기화
$form.find('textarea').val('');
// 필요 시 메모 목록 갱신
fetchMemo(leads_seq, function(memoList) {
var memoState = $('.btns-memo.active').val();
displayMemo(memoList, memoState, $row);
updateMemoBadge($row, memoList.length);
});
},
error: function(xhr, status, error) {
// 에러 시 처리할 내용
console.error('Error adding memo:', error);
}
});
}
// 메모 배지 업데이트
function updateMemoBadge($row, count) {
var $btnMemo = $row.find('.btn_memo');
$btnMemo.find('.badge').text(count);
}
// 모든 메모 업데이트
function updateAllMemos() {
$('.btn_memo').each(function() {
var $row = $(this).closest('tr');
var seq = $row.attr('id');
fetchMemo(seq, function(memoList) {
updateMemoBadge($row, memoList.length);
});
});
}
$('#dates').daterangepicker({
locale: {
"format": 'YYYY-MM-DD', // 일시 노출 포맷
"applyLabel": "확인", // 확인 버튼 텍스트
"cancelLabel": "취소", // 취소 버튼 텍스트
"daysOfWeek": ["일", "월", "화", "수", "목", "금", "토"],
"monthNames": ["1월", "2월", "3월", "4월", "5월", "6월", "7월", "8월", "9월", "10월", "11월", "12월"]
},
// singleDatePicker: true, // 단일 날짜 선택 활성화
alwaysShowCalendars: true, // 시간 노출 여부
showDropdowns: true, // 년월 수동 설정 여부
autoApply: true, // 확인/취소 버튼 사용여부
maxDate: new Date(),
autoUpdateInput: false,
maxSpan: {
days: 30
},
ranges: {
오늘: [moment(), moment()],
어제: [moment().subtract(1, "days"), moment().subtract(1, "days")],
최근7일: [moment().subtract(7, "days").startOf("day"), moment().subtract(1, "days").endOf("day")],
최근14일: [moment().subtract(14, "days").startOf("day"), moment().subtract(1, "days").endOf("day")],
이번주: [moment().day(1), moment()],
지난주: [moment().add(-1, "week").startOf("week").day(1), moment().add(-1, "week").startOf("week").add(7, "day")],
이번달: [moment().startOf("month"), moment().endOf("month")],
지난달: [moment().subtract(1, "month").startOf("month"), moment().subtract(1, "month").endOf("month")],
한달전: [moment().subtract(1, "month"), moment()],
},
}, function(start, end, label) {
startDate = start.format('YYYY-MM-DD'); // selected start
endDate = end.format('YYYY-MM-DD'); // selected end
$sdateInput = $('#sdate');
$edateInput = $('#edate');
$sdateInput.val(startDate);
$edateInput.val(endDate);
var dates = `${startDate} ~ ${endDate}`;
if(startDate == endDate) dates = startDate;
$('#dates').val(dates);
});
/*
* click Event List
*/
// 필터 초기화
$(document).on('click', '.reset-btn', function() {
$('.filter_btn').removeClass('active on');
dataTable.columns().search('').draw();
// DataTable 상태 초기화
dataTable.state.clear();
});
// content-title 클릭 시 folded 상태 토글 및 저장
$(document).on('click', '.client-list > .content-title', function() {
// DataTables 상태 저장
let settings = dataTable.settings();
settings[0].oInit.foldedStates = [];
$('.client-list > .content-title').each(function() {
settings[0].oInit.foldedStates.push($(this).hasClass('folded'));
});
// DataTable 상태 저장
dataTable.state.save();
});
// 메모 상태 저장 및 초기화
$(document).on('click', '.btns-memo', function() {
$('.btns-memo').removeClass('active'); // 모든 버튼에서 active 클래스 제거
$(this).addClass('active'); // 클릭된 버튼에 active 클래스 추가
// DataTables 상태 저장
let memoState = $(this).val();
let settings = dataTable.settings();
settings[0].oInit.memoState = memoState; // DataTables 상태에 memoState 추가
dataTable.state.save(); // 상태 저장
// 모달 및 테이블 초기화
$('#modal-integrate-memo .memo-list').empty();
$('.memo-row').remove();
// 메모 목록 갱신
if (memoState === 'all') {
displayAllMemos();
}
});
// 필터 버튼 클릭 시 해당 컬럼 필터링
$(document).on('click', '.filter_btn', function() {
$(this).toggleClass('active'); // 버튼 활성화/비활성화 토글
// 모든 열의 검색을 초기화
dataTable.columns().search('');
// 각 컬럼별로 활성화된 버튼의 텍스트를 배열로 수집하고 정규 표현식으로 조합
dataTable.columns().every(function() {
var column = this;
var filterType = column.dataSrc(); // 컬럼 헤더를 기반으로 필터 타입 결정
var activeFilters = $(`.filter_btn.active[data-btn="${filterType}"]`).map(function() {
return $.fn.dataTable.util.escapeRegex($(this).val());
}).get();
if (activeFilters.length) {
var regex = `^(${activeFilters.join('|')})$`; // '값1|값2|값3' 형태로 조합
column.search(regex, true, false); // 정규 표현식 검색 활성화
} else {
column.search(''); // 필터가 없는 경우 검색 초기화
}
});
dataTable.draw(); // 필터링 후 테이블 업데이트
});
// 메모 버튼 클릭 이벤트
$(document).on('click', '.btn_memo', function() {
var $row = $(this).closest('tr');
var seq = $row.attr('id');
var memoState = $('.btns-memo.active').val();
fetchMemo(seq, function(memoList) {
displayMemo(memoList, memoState, $row);
});
});
// regi-form 및 모달에서 메모 전송 이벤트 처리
$(document).on('click', '.btn-regi', function() {
var $form = $(this).closest('form');
var memo = $form.find('textarea').val();
var $row, leads_seq;
if ($form.closest('#modal-integrate-memo').length) {
// 모달에서 전송
leads_seq = $('#modal-integrate-memo').data('leads-seq');
$row = $(`[id="${leads_seq}"]`);
} else {
// 테이블에서 전송
$row = $form.closest('tr').prev();
leads_seq = $row.attr('id');
}
saveMemo(memo, leads_seq, $form, $row);
});
$('#search_btn').on('click', function(e) {
e.preventDefault(); // 폼 제출 방지
dataTable.ajax.reload(); // DataTables의 AJAX 요청을 다시 실행
});
</script>
<?=$this->endSection();?>
<!--푸터-->
<?=$this->section('footer');?>
<?=$this->endSection();?>
Reference in New Issue View Git Blame Copy Permalink