var selectedPdServiceId; // 제품(서비스) 아이디 var selectedVersionId; // 선택된 버전 아이디 var pdServiceListData; var versionListData; var resourceDataTable; // var selectedIndex; // 데이터테이블 선택한 인덱스 var selectedPage; // 데이터테이블 선택한 인덱스 //////////////////////////////////////////////////////////////////////////////////////// //Document Ready //////////////////////////////////////////////////////////////////////////////////////// function execDocReady() { var pluginGroups = [ [ "../reference/light-blue/lib/vendor/jquery.ui.widget.js", "../reference/light-blue/lib/vendor/http_blueimp.github.io_JavaScript-Templates_js_tmpl.js", "../reference/light-blue/lib/vendor/http_blueimp.github.io_JavaScript-Load-Image_js_load-image.js", "../reference/light-blue/lib/vendor/http_blueimp.github.io_JavaScript-Canvas-to-Blob_js_canvas-to-blob.js", "../reference/light-blue/lib/jquery.iframe-transport.js", "../reference/light-blue/lib/jquery.fileupload.js", "../reference/light-blue/lib/jquery.fileupload-fp.js", "../reference/light-blue/lib/jquery.fileupload-ui.js", "../reference/lightblue4/docs/lib/widgster/widgster.js", "../reference/lightblue4/docs/lib/slimScroll/jquery.slimscroll.min.js", "../reference/jquery-plugins/select2-4.0.2/dist/css/select2_lightblue4.css", "../reference/jquery-plugins/lou-multi-select-0.9.12/css/multiselect-lightblue4.css", "../reference/jquery-plugins/multiple-select-1.5.2/dist/multiple-select-bluelight.css", "../reference/jquery-plugins/select2-4.0.2/dist/js/select2.min.js", "../reference/jquery-plugins/lou-multi-select-0.9.12/js/jquery.quicksearch.js", "../reference/jquery-plugins/lou-multi-select-0.9.12/js/jquery.multi-select.js", "../reference/jquery-plugins/multiple-select-1.5.2/dist/multiple-select.min.js" ], [ // lightblue4 "../reference/jquery-plugins/dataTables-1.10.16/media/css/jquery.dataTables_lightblue4.css", "../reference/jquery-plugins/dataTables-1.10.16/extensions/Responsive/css/responsive.dataTables_lightblue4.css", "../reference/jquery-plugins/dataTables-1.10.16/extensions/Select/css/select.dataTables_lightblue4.css", "../reference/jquery-plugins/dataTables-1.10.16/media/js/jquery.dataTables.min.js", "../reference/jquery-plugins/dataTables-1.10.16/extensions/Responsive/js/dataTables.responsive.min.js", "../reference/jquery-plugins/dataTables-1.10.16/extensions/Select/js/dataTables.select.min.js", "../reference/jquery-plugins/dataTables-1.10.16/extensions/RowGroup/js/dataTables.rowsGroup.min.js", "../reference/jquery-plugins/dataTables-1.10.16/extensions/Buttons/js/dataTables.buttons.min.js", "../reference/jquery-plugins/dataTables-1.10.16/extensions/Buttons/js/buttons.html5.js", "../reference/jquery-plugins/dataTables-1.10.16/extensions/Buttons/js/buttons.print.js", "../reference/jquery-plugins/dataTables-1.10.16/extensions/Buttons/js/jszip.min.js" ], [ //날짜 검색 "../reference/light-blue/lib/bootstrap-datepicker.js", "../reference/jquery-plugins/datetimepicker-2.5.20/build/jquery.datetimepicker.min.css", "../reference/jquery-plugins/datetimepicker-2.5.20/build/jquery.datetimepicker.full.min.js", //chart Colors "./js/common/colorPalette.js", // Apache Echarts "../reference/jquery-plugins/echarts-5.4.3/dist/echarts.min.js", "./js/common/chart/eCharts/donutChart.js", "../reference/jquery-plugins/timerStyles.js" ], // 추가적인 플러그인 그룹들을 이곳에 추가하면 됩니다.(그룹 최대 4개) ]; loadPluginGroupsParallelAndSequential(pluginGroups) .then(function() { console.log('모든 플러그인 로드 완료'); //사이드 메뉴 처리 $('.widget').widgster(); setSideMenu("sidebar_menu_report", "sidebar_menu_report_alm_project"); //coming soon $("#count-down").TimeCircles( { circle_bg_color: "#f8f8f8", use_background: true, bg_width: .2, fg_width: 0.013, time: { Days: { color: "#f8f8f8" }, Hours: { color: "#f8f8f8" }, Minutes: { color: "#f8f8f8" }, Seconds: { color: "#f8f8f8" } } } ); //제품(서비스) 셀렉트 박스 이니시에이터 makePdServiceSelectBox(); //버전 멀티 셀렉트 박스 이니시에이터ㅎ makeVersionMultiSelectBox(); //날짜 dateTimePicker(); let mockAssignees = [{ "assignee_accountId": "616fc9fa327da40069b4ed4f", "assignee_emailAddress": "JY.J@abcde.com", "assignee_displayName": "JJY" }, { "assignee_accountId": "712020:ecc44245-6be8-4962-9a66-888bdb4f8e3a", "assignee_emailAddress": "HS.Y@abcde.com", "assignee_displayName": "YHS" }, { "assignee_accountId": "616f6f04860f78006bbafe38", "assignee_emailAddress": "SH.H@abcde.com", "assignee_displayName": "HSH" }, { "assignee_accountId": "63b2a039159df2c252e826e9", "assignee_emailAddress": "DM.L@abcde.com", "assignee_displayName": "LDM" }, { "assignee_accountId": "621ee5a449c90000701efe06", "assignee_emailAddress": "MG.L@abcde.com", "assignee_displayName": "LMG" }]; drawResourceTable(mockAssignees); // 높이 조정 $('.top-menu-div').matchHeight({ target: $('.top-menu-div-default') }); let mock = { "total": 5, "folder": 4, "in-progress": 1, "open": 2, "resolved": 1, "closed": 1 }; let mock1 = { "total": 5, "in-progress": 2, "open": 1, "resolved": 1, "closed": 1 }; // 스크립트 실행 로직을 이곳에 추가합니다. for (let i = 0; i < 2; i++) { let targetId = "donut" + i; let chartData; if (i===0) { chartData = mock;} if (i===1) { chartData = mock1;} //drawDonutChart_report(targetId, mock, cardWidth); donutChart_fullDataSheet(targetId, chartData); } }) .catch(function(e) { console.error('플러그인 로드 중 오류 발생'); console.error(e); }); }//.execDocReady /////////////////////// //제품 서비스 셀렉트 박스 ////////////////////// function makePdServiceSelectBox() { //제품 서비스 셀렉트 박스 이니시에이터 $(".chzn-select").each(function() { $(this).select2($(this).data()); }); //제품 서비스 셀렉트 박스 데이터 바인딩 $.ajax({ url: "/auth-user/api/arms/pdServicePure/getPdServiceMonitor.do", type: "GET", contentType: "application/json;charset=UTF-8", dataType: "json", progress: true, statusCode: { 200: function(data) { ////////////////////////////////////////////////////////// pdServiceListData = []; for (var k in data.response) { var obj = data.response[k]; pdServiceListData.push({ "pdServiceId": obj.c_id, "pdServiceName": obj.c_title }); var newOption = new Option(obj.c_title, obj.c_id, false, false); $("#selected_pdService").append(newOption).trigger("change"); } ////////////////////////////////////////////////////////// console.log("[fullDataSheet :: makePdServiceSelectBox] :: pdServiceListData => "); console.table(pdServiceListData); } } }); $("#selected_pdService").on("select2:open", function() { //슬림스크롤 makeSlimScroll(".select2-results__options"); }); // --- select2 ( 제품(서비스) 검색 및 선택 ) 이벤트 --- // $("#selected_pdService").on("select2:select", function(e) { selectedPdServiceId = $("#selected_pdService").val(); //refreshDetailChart(); 변수값_초기화(); // 제품( 서비스 ) 선택했으니까 자동으로 버전을 선택할 수 있게 유도 // 디폴트는 base version 을 선택하게 하고 ( select all ) //~> 이벤트 연계 함수 :: Version 표시 jsTree 빌드 bind_VersionData_By_PdService(); drawExcel("spreadsheet", excelMock); }); } // end makePdServiceSelectBox() function bind_VersionData_By_PdService() { $(".multiple-select option").remove(); $.ajax({ url: "/auth-user/api/arms/pdService/getVersionList?c_id=" + $("#selected_pdService").val(), type: "GET", dataType: "json", progress: true, statusCode: { 200: function(data) { ////////////////////////////////////////////////////////// var pdServiceVersionIds = []; versionListData = []; for (var k in data.response) { var obj = data.response[k]; pdServiceVersionIds.push(obj.c_id); versionListData.push({"c_id" : obj.c_id, "c_title" : obj.c_title, "start_date" : obj.c_pds_version_start_date, "end_date" : obj.c_pds_version_end_date}); var newOption = new Option(obj.c_title, obj.c_id, true, false); $(".multiple-select").append(newOption); } var versionTag = $(".multiple-select").val(); selectedVersionId = pdServiceVersionIds.join(","); // 시작일 종료일 세팅(datetimepicker) setEdgeDateRange(versionListData); if (data.length > 0) { console.log("display 재설정."); } $(".multiple-select").multipleSelect("refresh"); } } }); } //////////////////////////////////////// //버전 멀티 셀렉트 박스 //////////////////////////////////////// function makeVersionMultiSelectBox() { //버전 선택시 셀렉트 박스 이니시에이터 $(".multiple-select").multipleSelect({ filter: true, // selectBox 닫혔을 때 onClose: function() { console.log("onOpen event fire!\n"); var checked = $("#checkbox1").is(":checked"); var endPointUrl = ""; var versionTag = $(".multiple-select").val(); console.log("[ fullDataSheet :: makeVersionMultiSelectBox ] :: versionTag"); console.log(versionTag); selectedVersionId = versionTag.join(","); if (versionTag === null || versionTag == "") { alert("버전이 선택되지 않았습니다."); return; } let filteredVersionData = versionListData.filter(item => versionTag.includes(item.c_id.toString())); // 시작일 종료일 세팅(datetimepicker) setEdgeDateRange(filteredVersionData); $(".ms-parent").css("z-index", 1000); }, // selectBox 열렸을 때 onOpen: function() { $(".ms-parent").css("z-index", 9999); } }); } //////////////////////////////////////// // 기간 설정 세팅 //////////////////////////////////////// function dateTimePicker() { $('#date_timepicker_start').datetimepicker({ format: 'Y-m-d', // 날짜 및 시간 형식 지정 formatDate: 'Y/m/d', timepicker: false, theme: 'dark', lang: "kr", onSelectTime: function(current_time, $input) { $('#date_timepicker_end').datetimepicker('setOptions', { minDate: current_time }); }, onShow: function(ct) { this.setOptions({ maxDate: $('#date_timepicker_end').val() ? $('#date_timepicker_end').val() : false }); } }); $('#date_timepicker_end').datetimepicker({ format: 'Y-m-d', // 날짜 및 시간 형식 지정 formatDate: 'Y/m/d', timepicker: false, theme: 'dark', lang: "kr", onSelectTime: function(current_time, $input) { $('#date_timepicker_start').datetimepicker('setOptions', { maxDate: current_time }); }, onShow: function(ct) { this.setOptions({ minDate: $('#date_timepicker_start').val() ? $('#date_timepicker_start').val() : false }); } }); } //////////////////////////////////////// // 선택한 버전 - min,max 날짜 세팅 //////////////////////////////////////// function setEdgeDateRange(versionData) { if (!versionData || Object.keys(versionData).length === 0) { console.log("[ fullDataSheet :: setEdgeDateRange ] :: versionData 가 없습니다."); return false; } let minMaxDate = versionData.reduce((acc, curr) => { const startDate = new Date(curr.start_date); const endDate = new Date(curr.end_date); if (!acc.min || startDate < acc.min) { acc.min = startDate; } if (!acc.max || endDate > acc.max) { acc.max = endDate; } return acc; }, { min: null, max: null }); console.log("[ fullDataSheet :: setEdgeDateRange ] :: " + "minMaxDate.min => " + minMaxDate.min+ ", minMaxDate.max => " +minMaxDate.max); $('#date_timepicker_start').datetimepicker('setOptions', { value: minMaxDate.min }); $('#date_timepicker_end').datetimepicker('setOptions', { value: minMaxDate.max }); } //////////////////////////////////////// // resource 목록 정보. //////////////////////////////////////// function drawResourceTable(tableData) { var columnList = [ { name: "assignee_displayName", title: "작업자 명", data: "assignee_displayName", className: "dt-body-center", visible: true, render: function (data, type, row, meta) { if (type === "display") { return '"; } return data; } }, { name: "assignee_emailAddress", title: "작업자 메일", data: "assignee_emailAddress", className: "dt-body-center", visible: true, render: function (data, type, row, meta) { if (type === "display") { return '"; } return data; } } ]; var rowsGroupList = []; var jquerySelector = "#resource_table"; var ajaxUrl = ""; var jsonRoot = ""; var buttonList = []; var selectList = {}; var isServerSide = false; var isAjax = false; var columnDefList = []; var orderList = [[0, "asc"]]; // console.log(tableData); resourceDataTable = dataTable_build( jquerySelector, ajaxUrl, jsonRoot, columnList, rowsGroupList, columnDefList, selectList, orderList, buttonList, isServerSide, null, tableData, isAjax ); // $("#reqstatustable").on('page.dt', function() { // scrollPos = $(window).scrollTop(); // $(window).scrollTop(scrollPos); // }); } // -------------------- 데이터 테이블을 만드는 템플릿으로 쓰기에 적당하게 리팩토링 함. ------------------ // // 데이터 테이블 구성 이후 꼭 구현해야 할 메소드 : 열 클릭시 이벤트 function dataTableClick(tempDataTable, selectedData) { console.log(selectedData); } // 데이터 테이블 데이터 렌더링 이후 콜백 함수. function dataTableCallBack(settings, json) { console.log("check"); } function dataTableDrawCallback(tableInfo) { // resourceDataTable.columns.adjust(); console.log(tableInfo); }