no message
parent
1296b69490
commit
95a03372e9
@ -1,22 +0,0 @@
|
||||
|
||||
const cmmBS = {
|
||||
contextMenu: ({ rowKey, columnName }) => (
|
||||
[
|
||||
[
|
||||
{
|
||||
name: 'bsAdd',
|
||||
label: '바텀시트에 추가',
|
||||
action: function() {
|
||||
$('#bs').show(500);
|
||||
var props = {};
|
||||
props['rowKey'] = rowKey;
|
||||
props['grid'] = columnName;
|
||||
fnBiz.bsAdd(props);
|
||||
},
|
||||
classNames: ['']
|
||||
},
|
||||
],
|
||||
]
|
||||
),
|
||||
|
||||
}
|
||||
@ -1,224 +0,0 @@
|
||||
/* Download an img */
|
||||
|
||||
/**
|
||||
* <pre>
|
||||
* 첨부파일 정보 목록으로 부터 이미지 download
|
||||
* 이미지 url 사용
|
||||
* @param {string} divImgListElementId
|
||||
* @param {object} cmmFileDtls json
|
||||
* @param {function} fnBizPagePopup 이벤트 발생시 호출할 함수
|
||||
* @param {boolean} isEditor 이미지 클릭시 이미지 에디터로 open
|
||||
* @param {string} thumbnailSize 썸네일 이미지 크기 - default 100px
|
||||
* </pre>
|
||||
*/
|
||||
function cmmImgDownload(divImgListElementId, cmmFileDtls, fnBizPagePopup = fnBiz.pagePopup, isEditor, thumbnailSize = '100px', callback) {
|
||||
const downloadUrl = '/framework/biz/cmm/file/download.do';
|
||||
|
||||
$(divImgListElementId).children().remove();
|
||||
if(cmmFileDtls != null){
|
||||
cmmFileDtls.forEach((dtl, idx) => {
|
||||
let imgDiv = document.getElementById(dtl.infKey);
|
||||
if(!imgDiv?.hasChildNodes()){
|
||||
imgDiv = document.createElement("div");
|
||||
imgDiv.setAttribute("id", dtl.infKey);
|
||||
imgDiv.setAttribute("value", dtl.fileMastrId);
|
||||
imgDiv.setAttribute("class", "dragDiv")
|
||||
}
|
||||
|
||||
//const params = `?filename=${dtl.orginlFileNm}&` + $.param(dtl);
|
||||
const params = `?fileId=${dtl.fileId}&filePath=${dtl.filePath}&orginlFileNm=${dtl.orginlFileNm}`;
|
||||
const title = dtl.orginlFileNm;
|
||||
|
||||
const x = document.createElement("img");
|
||||
//x.setAttribute("class", "draggable")
|
||||
x.setAttribute("src", downloadUrl+params);
|
||||
x.setAttribute("id", dtl.fileId);
|
||||
x.setAttribute("class", "draggable")
|
||||
x.style = 'width:'+ thumbnailSize;
|
||||
x.style = 'height:'+ thumbnailSize;
|
||||
//x.style = 'object-fit: "contain";';
|
||||
//x.style = 'object-fit: scale-down;';
|
||||
x.setAttribute("title", title);
|
||||
x.setAttribute("alt", dtl.orginlFileNm);
|
||||
x.setAttribute("name", dtl.orginlFileNm);
|
||||
x.setAttribute("data-file-mastr-id", dtl.fileMastrId);
|
||||
x.setAttribute("data-file-id", dtl.fileId);
|
||||
x.setAttribute("data-file-path", dtl.filePath);
|
||||
x.setAttribute("data-file-size", dtl.fileSize);
|
||||
|
||||
x.addEventListener('dblclick', (e)=>{
|
||||
if(isEditor) {
|
||||
fnBizPagePopup('imageEditor', {imageTagId: dtl.fileId});
|
||||
}else{
|
||||
dtl.downloadUrl = downloadUrl+params;
|
||||
//dtl.editor = true;
|
||||
fnBizPagePopup('imageView', dtl);
|
||||
}
|
||||
})
|
||||
imgDiv.appendChild(x);
|
||||
document.querySelector(divImgListElementId).appendChild(imgDiv);
|
||||
});
|
||||
}
|
||||
|
||||
dragable();
|
||||
if(callback) callback();
|
||||
}
|
||||
|
||||
/**
|
||||
* file download 실행
|
||||
* @param blob
|
||||
* @param fileName
|
||||
*/
|
||||
function downloadFile(blob, fileName, callback){
|
||||
const url = URL.createObjectURL(blob);
|
||||
|
||||
const anchorElement = document.createElement('a');
|
||||
document.body.appendChild(anchorElement);
|
||||
anchorElement.download = fileName; // a tag에 download 속성을 줘서 클릭할 때 다운로드가 일어날 수 있도록 하기
|
||||
anchorElement.href = url; // href에 url 달아주기
|
||||
|
||||
anchorElement.click(); // 코드 상으로 클릭을 해줘서 다운로드를 트리거
|
||||
|
||||
// cleanup - 쓰임을 다한 url 객체 삭제
|
||||
anchorElement.onload = () => {
|
||||
URL.revokeObjectUrl(url);
|
||||
}
|
||||
//URL.revokeObjectUrl(url);
|
||||
document.body.removeChild(anchorElement); // cleanup - 쓰임을 다한 a 태그 삭제
|
||||
|
||||
if($.type(callback) === 'function') callback();
|
||||
}
|
||||
|
||||
function download(img) {
|
||||
var link = document.createElement("a");
|
||||
link.href = img.src;
|
||||
link.download = true;
|
||||
link.style.display = "none";
|
||||
var evt = new MouseEvent("click", {
|
||||
"view": window,
|
||||
"bubbles": true,
|
||||
"cancelable": true
|
||||
});
|
||||
|
||||
document.body.appendChild(link);
|
||||
link.dispatchEvent(evt);
|
||||
document.body.removeChild(link);
|
||||
console.log("Downloading...");
|
||||
}
|
||||
|
||||
/* Download all images in 'imgs'.
|
||||
* Optionaly filter them by extension (e.g. "jpg") and/or
|
||||
* download the 'limit' first only */
|
||||
function downloadAll(imgs, ext, limit) {
|
||||
/* If specified, filter images by extension */
|
||||
if (ext) {
|
||||
ext = "." + ext;
|
||||
imgs = [].slice.call(imgs).filter(function (img) {
|
||||
var src = img.src;
|
||||
return (src && (src.indexOf(ext, src.length - ext.length) !== -1));
|
||||
});
|
||||
}
|
||||
|
||||
/* Determine the number of images to download */
|
||||
limit = (limit && (0 <= limit) && (limit <= imgs.length))
|
||||
? limit : imgs.length;
|
||||
|
||||
/* (Try to) download the images */
|
||||
for (var i = 0; i < limit; i++) {
|
||||
var img = imgs[i];
|
||||
console.log("IMG: " + img.src + " (", img, ")");
|
||||
download(img);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
/*이미지 드레그앤 드롭 start*/
|
||||
function dragable() {
|
||||
const draggables = document.querySelectorAll(".draggable");
|
||||
const containers = document.querySelectorAll(".dragDiv");
|
||||
|
||||
|
||||
|
||||
draggables.forEach(draggable => {
|
||||
draggable.addEventListener("dragstart", () => {
|
||||
console.log('drag start => ', draggable.getAttribute('id'));
|
||||
draggable.classList.add("dragging");
|
||||
});
|
||||
|
||||
draggable.addEventListener("dragend", () => {
|
||||
console.log('drag end => ', draggable.getAttribute('data-file-mastr-id'));
|
||||
draggable.classList.remove("dragging");
|
||||
});
|
||||
});
|
||||
|
||||
containers.forEach(container => {
|
||||
container.addEventListener("dragover", e => {
|
||||
e.preventDefault();
|
||||
const afterElement = getDragAfterElement(container, e.clientX);
|
||||
const draggable = document.querySelector(".dragging");
|
||||
if (afterElement === undefined) {
|
||||
container.appendChild(draggable);
|
||||
} else {
|
||||
container.insertBefore(draggable, afterElement);
|
||||
}
|
||||
});
|
||||
});
|
||||
}
|
||||
function getDragAfterElement(container, x) {
|
||||
const draggableElements = [
|
||||
...container.querySelectorAll(".draggable:not(.dragging)"),
|
||||
];
|
||||
|
||||
return draggableElements.reduce(
|
||||
(closest, child) => {
|
||||
const box = child.getBoundingClientRect();
|
||||
const offset = x - box.left - box.width / 2;
|
||||
// console.log(offset);
|
||||
if (offset < 0 && offset > closest.offset) {
|
||||
return { offset: offset, element: child };
|
||||
} else {
|
||||
return closest;
|
||||
}
|
||||
},
|
||||
{ offset: Number.NEGATIVE_INFINITY },
|
||||
).element;
|
||||
}
|
||||
/*이미지 드레그앤 드롭 end*/
|
||||
|
||||
|
||||
/*이미지 드레그앤 드롭 저장 start*/
|
||||
function dragableSave() {
|
||||
let imgData = {};
|
||||
let imgNode = document.querySelector("#imgList").childNodes;
|
||||
console.log(imgNode);
|
||||
|
||||
for(let i=0; i<imgNode.length; i++) {
|
||||
console.log('imgNode',imgNode[i]);
|
||||
let imgNodeNo = imgNode[i];
|
||||
imgNodeNo = imgNodeNo.attributes.value.value;
|
||||
let imgNodeChild = imgNode[i].children;
|
||||
|
||||
var arr = new Array();
|
||||
imgData[imgNodeNo] = arr;
|
||||
|
||||
for(let i=0; i<imgNodeChild.length; i++){
|
||||
imgData[imgNodeNo].push(imgNodeChild[i].id);
|
||||
}
|
||||
}
|
||||
console.log('final', imgData);
|
||||
const imgEl = imgData;
|
||||
dragableSaveAjax(imgEl);
|
||||
}
|
||||
|
||||
function dragableSaveAjax(imgEl){
|
||||
cmmAjax({
|
||||
showSuccessMsg: false
|
||||
,url: "/fims/biz/ec/saveImg.do"
|
||||
,data: JSON.stringify(imgEl)
|
||||
,contentType: 'application/json'
|
||||
,success: (res) => {
|
||||
alert('저장되었습니다.')
|
||||
}
|
||||
})
|
||||
}
|
||||
@ -1,466 +0,0 @@
|
||||
const CmmPopup = {
|
||||
defaultOpenOptions: {
|
||||
/**
|
||||
* <pre>
|
||||
* 창의 높이.
|
||||
* </pre>
|
||||
*
|
||||
* @attribute {Number} (open) height
|
||||
*/
|
||||
height: 200
|
||||
|
||||
/**
|
||||
* <pre>
|
||||
* 창의 넓이.
|
||||
* </pre>
|
||||
*
|
||||
* @attribute {Number} (open) width
|
||||
*/
|
||||
, width: 400
|
||||
|
||||
/**
|
||||
* <pre>
|
||||
* 창 위치(y좌표).
|
||||
* </pre>
|
||||
*
|
||||
* @attribute {Number} (open) top
|
||||
*/
|
||||
, top: 0
|
||||
|
||||
/**
|
||||
* <pre>
|
||||
* 창 위치(x좌표).
|
||||
* </pre>
|
||||
*
|
||||
* @attribute {Number} (open) left
|
||||
*/
|
||||
, left: 0
|
||||
|
||||
/**
|
||||
* <pre>
|
||||
* 메뉴바 사용 여부. 파일, 편집, 보기 등의 버튼이 있는 줄. yes or no (안 됨)
|
||||
* </pre>
|
||||
*
|
||||
* @attribute {Object} (open) menubar
|
||||
*/
|
||||
, menubar: "no"
|
||||
|
||||
/**
|
||||
* <pre>
|
||||
* 툴바 사용 여부. 뒤로, 앞으로, 검색, 즐겨찾기 등의 버튼이 나오는 줄. yes or no
|
||||
* </pre>
|
||||
*
|
||||
* @attribute {Object} (open) toolbar
|
||||
*/
|
||||
, toolbar: "no"
|
||||
|
||||
/**
|
||||
* <pre>
|
||||
* 주소창 변경 여부. URL입력하는 곳. yes or no
|
||||
* </pre>
|
||||
*
|
||||
* @attribute {Object} (open) location
|
||||
*/
|
||||
, location: "no"
|
||||
|
||||
/**
|
||||
* <pre>
|
||||
* 리사이징 가능 여부. 새창이 떴을 시에 최소화, 최대화 등을 비롯해 마우스로 창의 크기를 조절 가능 여부. yes or no
|
||||
* </pre>
|
||||
*
|
||||
* @attribute {Object} (open) resizable
|
||||
*/
|
||||
, resizable: "no"
|
||||
|
||||
/**
|
||||
* <pre>
|
||||
* 창 아래 링크 사용 여부. 인터넷 창 아래부분 보면 회색깔의 링크 주소 나오는 부분. yes or no
|
||||
* </pre>
|
||||
*
|
||||
* @attribute {Object} (open) status
|
||||
*/
|
||||
, status: "no"
|
||||
|
||||
/**
|
||||
* <pre>
|
||||
* 스크롤바 사용여부. 우측부분과 하단 부분에 생기는 스크롤바를 지칭. yes or no
|
||||
* </pre>
|
||||
*
|
||||
* @attribute {Object} (open) scrollbars
|
||||
*/
|
||||
, scrollbars: "yes"
|
||||
|
||||
/**
|
||||
* <pre>
|
||||
* 창 최대화로 띄움. yes or no
|
||||
* </pre>
|
||||
*
|
||||
* @attribute {Object} (open) fullscreen
|
||||
*/
|
||||
, fullscreen: "no"
|
||||
|
||||
/**
|
||||
* <pre>
|
||||
* 가운데 정렬 여부. true 일 경우 top과 left를 자동 계산한다.
|
||||
* </pre>
|
||||
*
|
||||
* @attribute {Object} (open) useCenterLocation
|
||||
*/
|
||||
, useCenterLocation: true
|
||||
|
||||
/**
|
||||
* <pre>
|
||||
* method type. post일 경우 form을 생성하고 data attribute의 값을 넣어 전송.
|
||||
* </pre>
|
||||
*
|
||||
* @attribute {Object} (open) method
|
||||
*/
|
||||
, method: "get"
|
||||
|
||||
/**
|
||||
* <pre>
|
||||
* parameter data
|
||||
* </pre>
|
||||
*
|
||||
* @attribute {Object} (open) data
|
||||
*/
|
||||
, data: null
|
||||
}
|
||||
|
||||
, defaultModalDaialogOptions: {
|
||||
/**
|
||||
* <pre>
|
||||
* 창의 높이.
|
||||
* </pre>
|
||||
*
|
||||
* @attribute {Number} (modal) dialogHeight
|
||||
*/
|
||||
dialogHeight: 200
|
||||
|
||||
/**
|
||||
* <pre>
|
||||
* 창의 넓이.
|
||||
* </pre>
|
||||
*
|
||||
* @attribute {Number} (modal) dialogWidth
|
||||
*/
|
||||
, dialogWidth: 400
|
||||
|
||||
/**
|
||||
* <pre>
|
||||
* 창 위치(y좌표).
|
||||
* </pre>
|
||||
*
|
||||
* @attribute {Number} (modal) dialogTop
|
||||
*/
|
||||
, dialogTop: 0
|
||||
|
||||
/**
|
||||
* <pre>
|
||||
* 창 위치(x좌표).
|
||||
* </pre>
|
||||
*
|
||||
* @attribute {Number} (modal) dialogLeft
|
||||
*/
|
||||
, dialogLeft: 0
|
||||
|
||||
/**
|
||||
* <pre>
|
||||
* 가운데 정렬 여부. yes/no, 1/0, on/off (정확하지 않음. useCenterLocation 이용 권장.)
|
||||
* </pre>
|
||||
*
|
||||
* @attribute {String} (modal) center
|
||||
*/
|
||||
, center: "no"
|
||||
|
||||
/**
|
||||
* <pre>
|
||||
* 도움말 사용 여부. yes/no, 1/0, on/off
|
||||
* </pre>
|
||||
*
|
||||
* @attribute {String} (modal) help
|
||||
*/
|
||||
, help: "no"
|
||||
|
||||
/**
|
||||
* <pre>
|
||||
* 리사이징 가능 여부. 새창이 떴을 시에 최소화, 최대화 등을 비롯해 마우스로 창의 크기를 조절 가능 여부. yes/no, 1/0, on/off
|
||||
* </pre>
|
||||
*
|
||||
* @attribute {String} (modal) resizable
|
||||
*/
|
||||
, resizable: "no"
|
||||
|
||||
/**
|
||||
* <pre>
|
||||
* 스크롤바 사용여부. 우측부분과 하단 부분에 생기는 스크롤바를 지칭. yes or no
|
||||
* </pre>
|
||||
*
|
||||
* @attribute {String} (modal) scroll
|
||||
*/
|
||||
, scroll: "yes"
|
||||
|
||||
/**
|
||||
* <pre>
|
||||
* 메뉴바 사용 여부. 파일, 편집, 보기 등의 버튼이 있는 줄. yes or no (안 됨)
|
||||
* </pre>
|
||||
*
|
||||
* @attribute {String} (modal) menubar
|
||||
*/
|
||||
, menubar: "no"
|
||||
|
||||
/**
|
||||
* <pre>
|
||||
* 툴바 사용 여부. 뒤로, 앞으로, 검색, 즐겨찾기 등의 버튼이 나오는 줄. yes or no
|
||||
* </pre>
|
||||
*
|
||||
* @attribute {String} (modal) toolbar
|
||||
*/
|
||||
, toolbar: "no"
|
||||
|
||||
/**
|
||||
* <pre>
|
||||
* 주소창 변경 여부. URL입력하는 곳. yes or no
|
||||
* </pre>
|
||||
*
|
||||
* @attribute {String} (modal) location
|
||||
*/
|
||||
, locationbars: "no"
|
||||
|
||||
/**
|
||||
* <pre>
|
||||
* 상태바 사용여부. yes/no, 1/0, on/off
|
||||
* </pre>
|
||||
*
|
||||
* @attribute {String} (modal) status
|
||||
*/
|
||||
, status: "no"
|
||||
|
||||
/**
|
||||
* <pre>
|
||||
* 가운데 정렬 여부. true 일 경우 top과 left를 자동 계산한다.
|
||||
* </pre>
|
||||
*
|
||||
* @attribute {Boolean} (modal) useCenterLocation
|
||||
*/
|
||||
, useCenterLocation: true
|
||||
}
|
||||
|
||||
/**
|
||||
* <pre>
|
||||
* modaless CmmPopup.open(). options에 추가적으로 사용할 option 값을 json 객체의 필드 형태로 넘기면 된다.
|
||||
* @method open
|
||||
* @param {String} url 문서의 주소
|
||||
* @param {Object} options 추가적으로 사용할 option 값을 담은 json 객체
|
||||
* @param {Object} params parameter json object
|
||||
* @param {String} target default 'nonamePopup'
|
||||
* @param {String} method default 'get'
|
||||
* @returns {object} 새로 열린 팝업창의 윈도우 객체.
|
||||
* </pre>
|
||||
*/
|
||||
,open: function (url, params, options, target = 'nonamePopup', method = 'post') {
|
||||
var extendOptions = $.extend({}, this.defaultOpenOptions, options);
|
||||
|
||||
// 가운데 정렬 계산.
|
||||
if (extendOptions.useCenterLocation) {
|
||||
const centerPosition = this.getCenterPosition(extendOptions.width, extendOptions.height);
|
||||
extendOptions.left = centerPosition.left;
|
||||
extendOptions.top = centerPosition.top;
|
||||
}
|
||||
|
||||
// status 문자열 생성.
|
||||
var optionsString = "";
|
||||
for (var i in extendOptions) {
|
||||
optionsString += i + "=" + extendOptions[i] + ", ";
|
||||
}
|
||||
method = method.toLowerCase();
|
||||
var popup;
|
||||
|
||||
switch (method) {
|
||||
case "post":
|
||||
popup = window.open("", target, optionsString);
|
||||
const form = this._getForm(url, target, method, params ? params : {});
|
||||
form.submit();
|
||||
break;
|
||||
case "get":
|
||||
default:
|
||||
url += params ? "?" + $.param(params) : "";
|
||||
popup = window.open(url, target, optionsString);
|
||||
break;
|
||||
}
|
||||
if (popup) popup.focus();
|
||||
return popup;
|
||||
}
|
||||
|
||||
, openModal: function (url, params, options, title = 'nonamePopup', method = 'post') {
|
||||
if($("#popupShowBtn").length < 1){
|
||||
var modalTemplate = `<button type="button"
|
||||
id="popupShowBtn"
|
||||
data-bs-toggle="modal"
|
||||
data-bs-target="#cmmModal"
|
||||
hidden>
|
||||
</button>
|
||||
|
||||
<div class="modal fade" id="cmmModal" tabindex="-1">
|
||||
<div id="modalDialog" class="modal-dialog">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header modal-header-noheader">
|
||||
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close">
|
||||
</button>
|
||||
</div>
|
||||
<div id="modalBody" class="modal-body">
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>`;
|
||||
|
||||
$("body").append(modalTemplate);
|
||||
}
|
||||
|
||||
$("#modalDialog").attr("class","modal-dialog");
|
||||
|
||||
if(options.width) {
|
||||
$("#modalDialog").addClass("w-dialog-px-"+options.width);
|
||||
}
|
||||
|
||||
if($("#modalIframe").length > 0){
|
||||
$("#modalIframe").remove();
|
||||
}
|
||||
|
||||
var dynamicPopup = document.createElement("pop");
|
||||
dynamicPopup.setAttribute("id","pop"+1);
|
||||
|
||||
// .setAttribute("src" , "")
|
||||
// .setAttribute("width" , "100%")
|
||||
// .setAttribute("frameborder" , "0")
|
||||
// .setAttribute("scrolling" , "no")
|
||||
// .css("border" , "0")
|
||||
// .css("overflow" , "auto")
|
||||
// .css("overflow-x" , "no")
|
||||
;
|
||||
$("#modalBody").append(dynamicPopup);
|
||||
|
||||
popup = CmmPopup.open(url, params, options, "modalIframe", method);
|
||||
|
||||
$(popup.frameElement).on("load", function(){
|
||||
var popupHeight = $(popup.frameElement.contentDocument.getElementById("wrap")).height();
|
||||
$(popup.frameElement).attr("height", popupHeight);
|
||||
});
|
||||
|
||||
$("#popupShowBtn").trigger("click");
|
||||
|
||||
return popup;
|
||||
}
|
||||
/**
|
||||
* <pre>
|
||||
* 주소 검색 팝업 호출
|
||||
* 결과 return callback 함수로 fnCallbackZipSearch 사용
|
||||
* fnCallbackZipSearch 함수는 var 로 선언
|
||||
*
|
||||
* ex)
|
||||
* var fnCallbackZipSearch = (obj) => fnSetZipSearch(obj, document.userInfoVO);
|
||||
* </pre>
|
||||
*/
|
||||
,zipPopup: function(){
|
||||
let popUrl = '/_anonymous_/api/AdresSearch.do';
|
||||
const params = {callback: 'fnCallbackZipSearch'};
|
||||
const popTitle = "주소 찾기";
|
||||
const popOption = {width: 570, height:420};
|
||||
|
||||
this.open(popUrl, params ,popOption, '주소 검색');
|
||||
}
|
||||
|
||||
/**
|
||||
* <pre>
|
||||
* 주소 검색 Popup 결과를 set하는 콜백 함수
|
||||
* @param {Object} zipObj - 주소 검색 결과
|
||||
* @param {Object} tgtObj - 주소 검색 결과값을 Set할 객체(addr, zip, zip_view, daddr)
|
||||
*
|
||||
* ex)
|
||||
* var fnCallbackZipSearch = (obj) => CmmPopup.fnSetZipSearch(obj, document.userInfoVO);
|
||||
* </pre>
|
||||
*/
|
||||
,setZipSearch: function(zipObj, tgtObj){
|
||||
//화면에 출력
|
||||
tgtObj.addr.value = zipObj.roadAddrPart1;
|
||||
tgtObj.zip.value = zipObj.zipNo;
|
||||
tgtObj.zip_view.value = zipObj.zipNo;
|
||||
tgtObj.daddr.value = zipObj.roadAddrPart2 + ' ' + zipObj.addrDetail;
|
||||
|
||||
}
|
||||
|
||||
/**
|
||||
* modal CmmPopup.showModalDialog(). options에 추가적으로 사용할 option 값을 json 객체의 필드 형태로 넘기면 된다.
|
||||
* @method showModalDialog
|
||||
* @param {String} url 문서의 주소
|
||||
* @param {Object} argument 팝업창으로 넘길 데이터.
|
||||
* @param {Object} options 추가적으로 사용할 option 값을 담은 json 객체
|
||||
* @returns {object} 자식창에서 리턴하는 값.
|
||||
*/
|
||||
,showModalDialog: function (url, argument, options) {
|
||||
let extendOptions = $.extend({}, this.defaultModalDaialogOptions, options);
|
||||
|
||||
// 가운데 정렬 계산.
|
||||
if (extendOptions.useCenterLocation) {
|
||||
let centerPosition = this.getCenterPosition(extendOptions.dialogWidth, extendOptions.dialogHeight);
|
||||
extendOptions.dialogLeft = centerPosition.left + "px";
|
||||
extendOptions.dialogTop = centerPosition.top + "px";
|
||||
}
|
||||
extendOptions.dialogWidth += "px";
|
||||
extendOptions.dialogHeight += "px";
|
||||
|
||||
// status 문자열 생성.
|
||||
let optionsString = "";
|
||||
for (let i in extendOptions) {
|
||||
optionsString += i + "=" + extendOptions[i] + "; ";
|
||||
}
|
||||
|
||||
return window.showModalDialog(url, argument, optionsString);
|
||||
}
|
||||
|
||||
/**
|
||||
* 현재 브라우저에서 주어진 높이와 넓이를 가지는 창이 가운데에 위치되는 좌표 값을 구한다.
|
||||
* @method getCenterPosition
|
||||
* @param {Integer} width 넓이
|
||||
* @param {Integer} height 높이.
|
||||
* @returns {object} 해당 창이 가운데에 위치되는 좌표 값.
|
||||
*/
|
||||
,getCenterPosition : function(width, height) {
|
||||
const offsetX = typeof window.screenX != 'undefined' ? window.screenX : window.screenLeft;
|
||||
const offsetY = typeof window.screenY != 'undefined' ? window.screenY : window.screenTop;
|
||||
const browserWidth = typeof window.outerWidth!='undefined' ? window.outerWidth : document.documentElement.clientWidth;
|
||||
const browserHeight = typeof window.outerHeight != 'undefined' ? window.outerHeight: (document.documentElement.clientHeight - 22);
|
||||
const shownBrowserWidth = (offsetX < 0) ? window.screen.width + offsetX : offsetX;
|
||||
const left = parseInt(shownBrowserWidth + ((browserWidth - width) / 2), 10);
|
||||
const top = parseInt(offsetY + ((browserHeight - height) / 2), 10);
|
||||
return {left:left, top:top};
|
||||
}
|
||||
|
||||
/**
|
||||
* 폼생성
|
||||
* @method getProperty
|
||||
* @param {String} url 문서의 주소
|
||||
* @param {String} target 목표창 이름
|
||||
* @param {String} method form method type(get, post, etc)
|
||||
* @param {Object} data 서버로 전송할 parameter data
|
||||
* @returns {object} 새로 열린 팝업창의 윈도우 객체.
|
||||
*/
|
||||
,_getForm: function(url, target, method, data) {
|
||||
if($("#PopupForm").length) {
|
||||
$("#PopupForm").remove();
|
||||
}
|
||||
const form = $("<form id='PopupForm'></form>").attr("method", method)
|
||||
.attr("target", target)
|
||||
.attr("action", url);
|
||||
for(const i in data) {
|
||||
const input = $("<input />").attr("type", "hidden")
|
||||
.attr("name", i)
|
||||
.attr("value", data[i]);
|
||||
form.append(input);
|
||||
}
|
||||
$("body").append(form);
|
||||
|
||||
return form;
|
||||
}
|
||||
}
|
||||
@ -1,135 +0,0 @@
|
||||
// 이전/다음 페이지 navigation data
|
||||
|
||||
class PageNavigation {
|
||||
grid = null;
|
||||
pageNav = null;
|
||||
|
||||
// 현재 gridData 목록
|
||||
gridInfo = {
|
||||
gridDatas: null
|
||||
// 현재 rowData
|
||||
,curRowData: null
|
||||
// 현재 데이타 위치
|
||||
,curRowPos: null
|
||||
// 현재 데이타 위치
|
||||
,gridDataPos: null
|
||||
// 현재 page
|
||||
,pageNum: null
|
||||
// 페이지당 갯수
|
||||
,fetchSize: null
|
||||
// 전체 데이타 count
|
||||
,totalSize: null
|
||||
// 페이지 이동 구분
|
||||
,pageMove: null
|
||||
};
|
||||
|
||||
/**
|
||||
* 페이지 이동 or 팝업 호출시 생성
|
||||
* @param {object} GRID
|
||||
* @param {array} gridDatas 그리드 데이타 key 필드 배열
|
||||
* @param {number} gridDataPos 현재 그리드 페이지의 데이타 row
|
||||
*/
|
||||
constructor(GRID, gridDatas, gridDataPos) {
|
||||
let pageInfo = {
|
||||
pageNum: 1,
|
||||
fetchSize: null,
|
||||
totalSize: null
|
||||
};
|
||||
|
||||
if(GRID.paginationInfoRef.paging === true){
|
||||
const {pageNum, fetchSize, totalSize} = GRID.paginationInfoRef;
|
||||
pageInfo.pageNum = pageNum;
|
||||
pageInfo.fetchSize = fetchSize;
|
||||
pageInfo.totalSize = totalSize;
|
||||
}else{
|
||||
pageInfo.fetchSize = GRID.paginationInfoRef.totalSize;
|
||||
pageInfo.totalSize = GRID.paginationInfoRef.totalSize;
|
||||
}
|
||||
|
||||
this.gridInfo = {
|
||||
|
||||
gridDatas
|
||||
,gridDataPos
|
||||
,curRowData: gridDatas[gridDataPos]
|
||||
,curRowPos: (pageInfo.pageNum - 1) * pageInfo.fetchSize + gridDataPos + 1
|
||||
,pageNum: pageInfo.pageNum
|
||||
,fetchSize: pageInfo.fetchSize
|
||||
,totalSize: pageInfo.totalSize
|
||||
,pageMove: null
|
||||
,next: null
|
||||
}
|
||||
this.pageNav = this;
|
||||
this.grid = GRID;
|
||||
};
|
||||
|
||||
/**
|
||||
* 팝업 페이지 에서 강제 페이징 처리시 호출
|
||||
* @param {json} res 그리드 목록 조회 결과
|
||||
* @param {array} gridDatas 그리드 데이타 key 필드 배열
|
||||
* @param {function} callback 호출할 function - 생성한 PageNavigation을 함께 전달
|
||||
*/
|
||||
resetGrid(res, gridDatas, callback) {
|
||||
this.grid.resetData(res.data?.contents);
|
||||
if (this.gridInfo.next) this.pageNav = new PageNavigation(this.grid, gridDatas, 0);
|
||||
else this.pageNav = new PageNavigation(this.grid, gridDatas, this.gridInfo.fetchSize - 1);
|
||||
|
||||
callback(this.pageNav)
|
||||
}
|
||||
/**
|
||||
* 팝업창의 prev, next 버튼 클릭후 정보 갱신을 위해 호출
|
||||
* @param {object} prevObj prev button object
|
||||
* @param {object} nextObj next button object
|
||||
* @param {object} totObj total tag object
|
||||
*/
|
||||
reloadNav(prevObj, nextObj, totObj){
|
||||
|
||||
if(this.gridInfo.curRowPos === 1){
|
||||
prevObj.attr('disabled', true);
|
||||
}else{
|
||||
prevObj.attr('disabled', false);
|
||||
}
|
||||
if(this.gridInfo.curRowPos === this.gridInfo.totalSize){
|
||||
nextObj.attr('disabled', true);
|
||||
}else{
|
||||
nextObj.attr('disabled', false);
|
||||
}
|
||||
totObj.text(this.gridInfo.curRowPos + " / " + this.gridInfo.totalSize);
|
||||
}
|
||||
|
||||
/**
|
||||
* 팝업창 prev, next 버튼 클릭시 호출
|
||||
* @param {string} evDiv 'prev|next'
|
||||
* @param {function} callback 페이지 이동시 호출할 callback
|
||||
*/
|
||||
onClickNavBtn(evDiv, callback) {
|
||||
const isTypeScroll = this.grid.paginationInfoRef?.pagingType === 'scroll';
|
||||
|
||||
if (evDiv === 'next') {
|
||||
if(this.gridInfo.gridDataPos + 1 === this.gridInfo.fetchSize){
|
||||
this.gridInfo.pageMove = true;
|
||||
this.gridInfo.next = true;
|
||||
this.gridInfo.pageNum++;
|
||||
|
||||
}else{
|
||||
this.gridInfo.curRowPos++;
|
||||
this.gridInfo.gridDataPos++;
|
||||
this.gridInfo.curRowData = this.gridInfo.gridDatas[this.gridInfo.gridDataPos];
|
||||
callback(this.gridInfo);
|
||||
}
|
||||
|
||||
} else {
|
||||
if(this.gridInfo.gridDataPos === 0){
|
||||
this.gridInfo.pageMove = true;
|
||||
this.gridInfo.next = false;
|
||||
this.gridInfo.pageNum--;
|
||||
|
||||
}else {
|
||||
this.gridInfo.curRowPos--;
|
||||
this.gridInfo.gridDataPos--;
|
||||
this.gridInfo.curRowData = this.gridInfo.gridDatas[this.gridInfo.gridDataPos];
|
||||
callback(this.gridInfo)
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Loading…
Reference in New Issue