List View (Excel)
Index: arms/js/reportFullData.js
===================================================================
diff -u -r94db4429c8289567d4d0097ab70513bae43c7a09 -r7f2627953512b2b0d8b745b679d338a424b68a94
--- arms/js/reportFullData.js (.../reportFullData.js) (revision 94db4429c8289567d4d0097ab70513bae43c7a09)
+++ arms/js/reportFullData.js (.../reportFullData.js) (revision 7f2627953512b2b0d8b745b679d338a424b68a94)
@@ -113,31 +113,7 @@
$('.top-menu-div').matchHeight({
target: $('.top-menu-div-default')
});
- mockData.assignees = [{
- "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"
- }];
+
mockData.excelMock = [
{
"제품(서비스) 키": "25",
@@ -466,8 +442,10 @@
}
let urlBuilder = new UrlBuilder()
- .setBaseUrl('/auth-user/api/arms/report/full-data/excel-data')
- .addQueryParam('pdServiceId', pdServiceId);
+ .setBaseUrl(`/auth-user/api/arms/report/full-data/T_ARMS_REQADD_${pdServiceId}/excel-data`)
+ .addQueryParam('pdServiceId', pdServiceId)
+ .addQueryParam('page', 0)
+ .addQueryParam('size', 1000);
const { pdServiceVersionIds = null, almProjectIds = null, startDate = null, endDate = null, emailAddress = null } = optionalParams;
@@ -480,14 +458,16 @@
});
const url = urlBuilder.build();
-
+ console.log("[ reportFullData :: fetchExcelData ] ::requestURL => ", url);
$.ajax({
url: url,
type: "GET",
dataType: "json",
success: function(data) {
+ console.log("[ reportFullData :: fetchExcelData ] :: excelData => start ");
console.log(data.response);
- drawExcel("spreadsheet", mockData.excelMock);
+ console.log("[ reportFullData :: fetchExcelData ] :: excelData <== end ");
+ //drawExcel("spreadsheet", data.response);
},
error: function(xhr, status, error) {
console.error(error);
@@ -684,28 +664,28 @@
console.log(data);
let $targetId = "#" + targetId;
- if($($targetId)[0].jexcel) {
+ if ($($targetId)[0].jexcel) {
console.log($($targetId)[0].jexcel);
$($targetId)[0].jexcel.destroy();
}
console.log("width=> " + $($targetId).width());
- var excelWidth=$($targetId).width() - 50;
+ var excelWidth = $($targetId).width() - 50;
var columnList = [
- { readOnly: true, type: "text", title: "제품(서비스) 키", wRatio: 0.1}, //0
- { readOnly: true, type: "text", title: "제품(서비스) 명", wRatio: 0.1},
- { readOnly: true, type: "text", title: "버전 키", wRatio: 0.05},
- { readOnly: true, type: "text", title: "버전 명", wRatio: 0.1},
- { readOnly: true, type: "text", title: "작업자", wRatio: 0.1}, //4
- { readOnly: true, type: "text", title: "C_REQ_LINK", wRatio: 0.08},
- { readOnly: true, type: "text", title: "요구사항 구분", wRatio: 0.1}, // 요구사항 이슈, 연결이슈, 하위이슈
- { readOnly: true, type: "text", title: "ALM 이슈 제목", wRatio: 0.2},
- { readOnly: true, type: "text", title: "ALM 이슈 상태", wRatio: 0.1},
- { readOnly: true, type: "text", title: "ALM 이슈 우선순위", wRatio: 0.1}, //9
- { readOnly: true, type: "calendar", title: "ALM 이슈 생성일", wRatio: 0.1},
- { readOnly: true, type: "calendar", title: "ALM 이슈 수정일", wRatio: 0.1},
- { readOnly: true, type: "calendar", title: "ALM 이슈 해결일", wRatio: 0.1},
- { readOnly: true, type: "text", title: "ALM 이슈 삭제여부", wRatio: 0.1}
+ { readOnly: true, type: "text", title: "제품(서비스) 키", wRatio: 0.1 }, //0
+ { readOnly: true, type: "text", title: "제품(서비스) 명", wRatio: 0.1 },
+ { readOnly: true, type: "text", title: "버전 키", wRatio: 0.05 },
+ { readOnly: true, type: "text", title: "버전 명", wRatio: 0.1 },
+ { readOnly: true, type: "text", title: "작업자", wRatio: 0.1 }, //4
+ { readOnly: true, type: "text", title: "C_REQ_LINK", wRatio: 0.08 },
+ { readOnly: true, type: "text", title: "요구사항 구분", wRatio: 0.1 }, // 요구사항 이슈, 연결이슈, 하위이슈
+ { readOnly: true, type: "text", title: "ALM 이슈 제목", wRatio: 0.2 },
+ { readOnly: true, type: "text", title: "ALM 이슈 상태", wRatio: 0.1 },
+ { readOnly: true, type: "text", title: "ALM 이슈 우선순위", wRatio: 0.1 }, //9
+ { readOnly: true, type: "calendar", title: "ALM 이슈 생성일", wRatio: 0.1 },
+ { readOnly: true, type: "calendar", title: "ALM 이슈 수정일", wRatio: 0.1 },
+ { readOnly: true, type: "calendar", title: "ALM 이슈 해결일", wRatio: 0.1 },
+ { readOnly: true, type: "text", title: "ALM 이슈 삭제여부", wRatio: 0.1 }
];
@@ -722,126 +702,230 @@
// 9. 요구사항 이슈의 해결된 날짜 / 닫힘이 된 날짜
var columnList_수정_key제외 = [
- { readOnly: true, type: "text", title: "제품(서비스)", wRatio: 0.1}, //0
- { readOnly: true, type: "text", title: "버전(일정)", wRatio: 0.1}, //1 버전(시작일 ~ 종료일)
- { readOnly: true, type: "text", title: "ALM Project", wRatio: 0.1}, //2 ALM Project
- { readOnly: true, type: "text", title: "요구사항 구분", wRatio: 0.1}, //3 요구사항 이슈, 연결이슈, 하위이슈
- { readOnly: true, type: "text", title: "A-RMS 요구사항", wRatio: 0.1}, //4 암스가 생성한 요구사항
- { readOnly: true, type: "text", title: "A-RMS 요구사항 상태", wRatio: 0.1}, //5 암스 요구사항 상태
- { readOnly: true, type: "text", title: "ALM 이슈 제목", wRatio: 0.2}, //6
- { readOnly: true, type: "text", title: "ALM 이슈 상태", wRatio: 0.1}, //7
- { readOnly: true, type: "text", title: "ALM 이슈 담당자", wRatio: 0.1}, //8
- { readOnly: true, type: "calendar", title: "ALM 이슈 생성일", wRatio: 0.1}, //9
- { readOnly: true, type: "calendar", title: "ALM 이슈 수정일", wRatio: 0.1}, //10
- { readOnly: true, type: "calendar", title: "ALM 이슈 해결일", wRatio: 0.1}, //11 해결된 날짜 또는 닫힌 날짜
+ { readOnly: true, type: "text", title: "제품(서비스)", wRatio: 0.1 }, //0
+ { readOnly: true, type: "text", title: "버전(일정)", wRatio: 0.1 }, //1 버전(시작일 ~ 종료일)
+ { readOnly: true, type: "text", title: "ALM Project", wRatio: 0.1 }, //2 ALM Project
+ { readOnly: true, type: "text", title: "요구사항 구분", wRatio: 0.1 }, //3 요구사항 이슈, 연결이슈, 하위이슈
+ { readOnly: true, type: "text", title: "A-RMS 요구사항", wRatio: 0.1 }, //4 암스가 생성한 요구사항
+ { readOnly: true, type: "text", title: "A-RMS 요구사항 상태", wRatio: 0.1 }, //5 암스 요구사항 상태
+ { readOnly: true, type: "text", title: "ALM 이슈 제목", wRatio: 0.2 }, //6
+ { readOnly: true, type: "text", title: "ALM 이슈 상태", wRatio: 0.1 }, //7
+ { readOnly: true, type: "text", title: "ALM 이슈 담당자", wRatio: 0.1 }, //8
+ { readOnly: true, type: "calendar", title: "ALM 이슈 생성일", wRatio: 0.1 }, //9
+ { readOnly: true, type: "calendar", title: "ALM 이슈 수정일", wRatio: 0.1 }, //10
+ { readOnly: true, type: "calendar", title: "ALM 이슈 해결일", wRatio: 0.1 }, //11 해결된 날짜 또는 닫힌 날짜
];
var columnList_수정_키포함 = [
- { readOnly: true, type: "text", title: "제품(서비스) 키", wRatio: 0.1}, //0
- { readOnly: true, type: "text", title: "제품(서비스)", wRatio: 0.1}, //1
- { readOnly: true, type: "text", title: "버전 키", wRatio: 0.1}, //2
- { readOnly: true, type: "text", title: "버전(일정)", wRatio: 0.1}, //3 버전(시작일 ~ 종료일)
- { readOnly: true, type: "text", title: "ALM Project 키", wRatio: 0.1}, //4 ALM Project
- { readOnly: true, type: "text", title: "ALM Project", wRatio: 0.1}, //5 ALM Project
- { readOnly: true, type: "text", title: "요구사항 구분", wRatio: 0.1}, //6 요구사항 이슈, 연결이슈, 하위이슈
- { readOnly: true, type: "text", title: "C_REQ_LINK", wRatio: 0.1}, //7
- { readOnly: true, type: "text", title: "A-RMS 요구사항", wRatio: 0.1}, //8 암스가 생성한 요구사항
- { readOnly: true, type: "text", title: "A-RMS 요구사항 상태", wRatio: 0.1}, //9 암스 요구사항 상태
- { readOnly: true, type: "text", title: "ALM 이슈 제목", wRatio: 0.2}, //10
- { readOnly: true, type: "text", title: "ALM 이슈 상태", wRatio: 0.1}, //11
- { readOnly: true, type: "text", title: "ALM 이슈 담당자", wRatio: 0.1}, //12
- { readOnly: true, type: "calendar", title: "ALM 이슈 생성일", wRatio: 0.1}, //13
- { readOnly: true, type: "calendar", title: "ALM 이슈 수정일", wRatio: 0.1}, //14
- { readOnly: true, type: "calendar", title: "ALM 이슈 해결일", wRatio: 0.1}, //15 해결된 날짜 또는 닫힌 날짜
+ { readOnly: true, type: "text", title: "제품(서비스) 키", wRatio: 0.1 }, //0
+ { readOnly: true, type: "text", title: "제품(서비스)", wRatio: 0.1 }, //1
+ { readOnly: true, type: "text", title: "버전 키", wRatio: 0.1 }, //2
+ { readOnly: true, type: "text", title: "버전(일정)", wRatio: 0.1 }, //3 버전(시작일 ~ 종료일)
+ { readOnly: true, type: "text", title: "ALM Project 키", wRatio: 0.1 }, //4 ALM Project
+ { readOnly: true, type: "text", title: "ALM Project", wRatio: 0.1 }, //5 ALM Project
+ { readOnly: true, type: "text", title: "요구사항 구분", wRatio: 0.1 }, //6 요구사항 이슈, 연결이슈, 하위이슈
+ { readOnly: true, type: "text", title: "C_REQ_LINK", wRatio: 0.1 }, //7
+ { readOnly: true, type: "text", title: "A-RMS 요구사항", wRatio: 0.1 }, //8 암스가 생성한 요구사항
+ { readOnly: true, type: "text", title: "A-RMS 요구사항 상태", wRatio: 0.1 }, //9 암스 요구사항 상태
+ { readOnly: true, type: "text", title: "ALM 이슈 제목", wRatio: 0.2 }, //10
+ { readOnly: true, type: "text", title: "ALM 이슈 상태", wRatio: 0.1 }, //11
+ { readOnly: true, type: "text", title: "ALM 이슈 담당자", wRatio: 0.1 }, //12
+ { readOnly: true, type: "calendar", title: "ALM 이슈 생성일", wRatio: 0.1 }, //13
+ { readOnly: true, type: "calendar", title: "ALM 이슈 수정일", wRatio: 0.1 }, //14
+ { readOnly: true, type: "calendar", title: "ALM 이슈 해결일", wRatio: 0.1 }, //15 해결된 날짜 또는 닫힌 날짜
];
+}
+/////////////////////////////////////////////////
+// 엑셀 그리기
+/////////////////////////////////////////////////
+function drawExcel(target, data) {
+ var columnList = [
+ { type: "text", title: "이름", wRatio: 0.25, readOnly: true },
+ { type: "text", title: "키", wRatio: 0.25, readOnly: true },
+ { type: "text", title: "연봉", wRatio: 0.5 }
+ ];
- SpreadSheetFunctions.setColumns(columnList);
- SpreadSheetFunctions.setColumnWidth(excelWidth);
- var customOptions = {
- pagination:10,
+ var customOption = {
+ pagination: 30,
contextMenu: [],
+ search: true,
+ allowInsertRow: false,
+ allowInsertColumn: false,
updateTable: function(instace, cell, col, row, val, id) {
cell.style.whiteSpace = "normal";
- if(col === 0 || col === 2 || col ===5) {
+ cell.style.whiteSpace = "normal";
+ if (col === 0 || col === 2 || col === 5) {
cell.style.textAlign = "right";
cell.style.color = "#a4c6ff";
} else if (col === 1 || col === 4 || col === 7) {
cell.style.textAlign = "left";
}
}
};
+ SpreadsheetFunctions.setTargetId(target);
+ SpreadsheetFunctions.setDefaultTargetRect();
- SpreadSheetFunctions.setExcelData(data);
- SpreadSheetFunctions.setOptions(customOptions);
-
- $($targetId).spreadsheet($.extend({}, {
- columns: SpreadSheetFunctions.getColumns(),
- data: SpreadSheetFunctions.getExcelData()
- }, SpreadSheetFunctions.getOptions()));
+ SpreadsheetFunctions.setColumns(columnList);
+ SpreadsheetFunctions.setColumnWidth(SpreadsheetFunctions.getTargetRect("width"));
+ SpreadsheetFunctions.setOptions(customOption);
+ SpreadsheetFunctions.startObserver();
+ SpreadsheetFunctions.setExcelData(data);
+ SpreadsheetFunctions.drawExcel(SpreadsheetFunctions.getTargetId());
}
-var SpreadSheetFunctions = ( function () {
- let $tabFunction_data; // 엑셀 데이터
- let $tabFunction_columns;// 엑셀 컬럼
- let $tabFunction_options;// 엑셀 (커스텀)옵션 :: 정의 안할 경우 default
- let $sheetInstance;
- var setESheet = function(obj) {
- $sheetInstance = obj;
+
+var SpreadsheetFunctions = (function () {
+ let targetId = { "v" : "", "jq" : ""};
+ let targetRect = {"width" : 0, "height" : 0};
+ let excelData; // 엑셀 데이터
+ let excelColumns; // 엑셀 컬럼
+ let customOptions;// 엑셀 커스텀 옵션들 :: 정의 안할 경우 default
+
+
+ var setDefaultTargetRect = function () {
+ let defaultWidth = $(getTargetId("jq")).width();
+ let defaultHeight = $(getTargetId("jq")).height();
+ setTargetRect(defaultWidth, defaultHeight);
};
+ var setTargetRect = function(width, height) {
+ targetRect.width = width;
+ targetRect.height = height;
+ };
+
+ var getTargetRect = function (type) {
+ if (type === "width") {
+ return targetRect.width;
+ } else if (type === "height") {
+ return targetRect.height;
+ } else {
+ return targetRect;
+ }
+ };
+
+ var setTargetId = function (target) {
+ targetId.v = target;
+ targetId.jq = "#"+target;
+ };
+
+ var getTargetId = function (type) {
+ if (type === "jq") {
+ return targetId.jq;
+ } else {
+ return targetId.v;
+ }
+ };
+
var setExcelData = function(data) {
- $tabFunction_data = data;
+ excelData = data;
};
var getExcelData = function () {
- return $tabFunction_data;
+ return excelData;
};
var setColumns = function(columns) {
- console.log("setColumns");
- $tabFunction_columns = columns;
+ excelColumns = columns;
};
var getColumns = function () {
- return $tabFunction_columns;
+ return excelColumns;
};
+
+ var setColumnWidth = function (width) {
+ if (excelColumns) {
+ excelColumns = excelColumns.map(column => ({
+ ...column, width: (width * column.wRatio) -1
+ }));
+ }
+ };
+
+ function setColumnWidthAsync(width) {
+ return new Promise((resolve) => {
+ if (excelColumns) {
+ excelColumns = excelColumns.map(column => ({
+ ...column, width: (width * column.wRatio) - 1
+ }));
+ }
+ resolve(); // 컬럼 너비 설정이 완료된 후 resolve 호출
+ });
+ }
+
var setOptions = function(options) {
- $tabFunction_options = options;
+ customOptions = options;
};
var getOptions = function() {
- return $tabFunction_options ? $tabFunction_options : null;
+ return customOptions ? customOptions : null;
};
- var setColumnWidth = function (width) {
- $tabFunction_columns = $tabFunction_columns.map(column => ({
- ...column, width: width * column.wRatio
- }));
- };
var resizeObserver = new ResizeObserver(function(entries) {
for (let entry of entries) {
- var width = entry.contentRect.width;
- var height = entry.contentRect.height;
- handleResize(entry.target.id, width, height);
+ setTargetRect(entry.contentRect.width, entry.contentRect.height);
+ handleResize(entry.target.id, getTargetRect("width"), getTargetRect("height"));
}
});
- // 모달요소 크기 변화 관찰
- resizeObserver.observe(document.getElementById('spreadsheet'));
+ // 모달요소 크기 변화 관찰(Observer)
+ function startObserver() {
+ resizeObserver.observe($(getTargetId("jq"))[0]);
+ }
- function handleResize(id,width, height) {
- console.log("handleResize => ",width,height);
- if (id ==="spreadsheet" && height !== 0) {
- if (Object.keys(mockData.assignees).length > 0) {
- drawExcel("spreadsheet", mockData.excelMock);
+ function handleResize(id, width, height) {
+ if (id === getTargetId() && height !== 0) {
+ if (excelData) {
+ drawResizedExcel(getTargetId());
} else {
- console.log("인력별_연봉정보 데이터가 없습니다.");
+ console.log("Spreadsheet.handleResize :: 엑셀 데이터 없음");
}
+
+ } else {
+ console.log("Spreadsheet.handleResize :: id 불일치 또는 height 가 0 입니다.");
}
}
+ function drawResizedExcel(target) {
+ let $targetId = "#"+target;
+
+ if($($targetId).length > 0 && $($targetId)[0].jexcel) {
+ $($targetId)[0].jexcel.destroy();
+ }
+
+ setColumnWidthAsync(getTargetRect("width") - 50).then(() => {
+ $($targetId).spreadsheet($.extend({}, {
+ columns: getColumns(),
+ data: getExcelData()
+ }, getOptions()));
+
+ let jexcel_content_height = getTargetRect("height") - 40 - 30 - 35 - 34;
+ $($targetId + " .jexcel_content").css("max-height", jexcel_content_height);
+ $($targetId + " .jexcel_content").css("width", "100%");
+ });
+ }
+
+ function drawExcel(target) {
+ let $targetId = "#"+target;
+
+ if($($targetId).length > 0 && $($targetId)[0].jexcel) {
+ $($targetId)[0].jexcel.destroy();
+ }
+
+ $($targetId).spreadsheet($.extend({}, {
+ columns: getColumns(),
+ data: getExcelData()
+ }, getOptions()));
+
+ let jexcel_content_height = getTargetRect("height") - 40 - 30 - 35 - 34;
+ $($targetId + " .jexcel_content").css("max-height", jexcel_content_height);
+ $($targetId + " .jexcel_content").css("width", "100%");
+
+ }
+
return {
- setExcelData, getExcelData,
- setColumns, getColumns,
- setOptions, getOptions,
- setColumnWidth
+ setTargetId, getTargetId,
+ setTargetRect, getTargetRect, setDefaultTargetRect,
+ setExcelData, getExcelData,
+ setColumns, getColumns, setColumnWidth,
+ setOptions, getOptions,
+
+ startObserver, drawExcel
};
})();
\ No newline at end of file