JS 기본 구조 및 기본 함수
자재관리 > 구매관리 > 구매요청 을 기준으로 설명
/**
* Date: 최초작성일
* Author: 작성자
* Description: 메뉴명
*
**/
var GP_SM_PR_003 = {
//전역 변수
initMessage: undefined,
// 초기화 함수
init : function(){
let that = this;
that.event();
},
event: function() {
let that = this;
},
ajaxFunc : function (url, WEBDATA, msg) {
let that = this;
ngsWidget.ajax(0, 'C', url, WEBDATA, function (index, result, data) {
ngsWidget.splashHide();
if (result != 'SUCCESS') {
setTimeout(() => {
ngsWidget.messageBox({type: 'danger', html: ngsLang.getLang(data.errMsg)});
}, 50);
return;
}
setTimeout(() => {
ngsWidget.messageBox({type: 'success', html: ngsLang.getLang(msg)});
$('#findBtn1').click();
}, 50);
}, undefined, {index: 0, op: 'process', seq: 1, spec: 'JOB', product: 'MES'}, false, that);
},
popUpSaveCallBack: function (index, data, rowIndex, popupName) {
},
//#region 조회조건 기간 SETTING
getMonth : (diff) => {
const today = new Date();
const month = new Date(today.getFullYear(), today.getMonth() + diff, 1);
const fromDate = new Date(month.getFullYear(), month.getMonth(), 1);
const toDate = new Date(month.getFullYear(), month.getMonth() + 1, 0);
return { fromDate, toDate };
},
getDay : (diff) => {
const today = new Date();
const fromDate = new Date(today.setDate(today.getDate() + diff));
const toDate = fromDate;
return { fromDate, toDate };
},
convertToyyyyMMdd : (date) => {
if (date) {
const year = date.getFullYear();
const month = String(date.getMonth() + 1).padStart(2, '0');
const day = String(date.getDate()).padStart(2, '0');
return `${year}-${month}-${day}`;
}
return null;
},
//#endregion
};
// 문서 로드 완료 후 초기화
$(document).ready(() => {
ngsWidget.init(1, "GRID", "GP_SM_PR_003", GP_SM_PR_003);
GP_SM_PR_003.init();
});
Init Callback 함수
retrieveCallInit: function(index, param, callBackParam, indexInfo)
retrieveCallBack: function(index, result, data, param, callBackParam, indexInfo)
saveCallInit: function(index, param, callBackParam, indexInfo)
saveCallBack: function(index, result, data, param, callBackParam, indexInfo)
delCallInit: function(index, param, callBackParam, indexInfo)
delCallBack: function(index, result, data, param, callBackParam, indexInfo)
addRowCallInit: function(index, param, callBackParam, indexInfo)
addRowCallBack: function(index, param, callBackParam, indexInfo)
addBottomRowCallInit: function(index, param, callBackParam, indexInfo)
addBottomRowCallBack: function(index, param, callBackParam, indexInfo)
excelDownCallInit: function(index, param, callBackParam, indexInfo)
excelViewDownCallInit: function(index, param, callBackParam, indexInfo)
excelGridCallBack: function(index)
openPopUpCallInit: function(index, e)
openPopUpCallBack: function(idx, e)
closePopUpCallInit: function(idx, e)
closePopUpCallBack: function(idx, e)
cellEditBeginCallBack : function(index, e)
cellClickCallInit : function(index, e)
cellClickCallBack : function(index, e)
cellEditEndBeforeCallBack : function(index, e)
pageLoadedCallBack : function(index, widget)
jqxComboBoxSelectCallBack : function(dataField, which, value)
cellEditAutoValidateCallBack: function(index, e)
gridPropertyChangeCallBack: function(index, property)
retrieveCallInit: function(index, param, callBackParam, indexInfo) {
//조회 시, Data Validation(필수 항목 및 기타 Validation) 이 부합되면 조회 연산 가장 맨앞에 호출되는 함수 조회 연산 또는 저장/수정/삭제 후에는 재조회가 되며 retrieveCallInit이 실행된다.
//index: 위젯 index (어떤 위젯에서 조회가 발생되었는지, 순번은 0부터 시작: 0은 1번 grid를 의미함)
//param: 조회할 데이터 값 (1차원 JSON 값으로 전달되며, 필터영역에서 검색 시 입력한 값이 담겨있음)이 전달되며, 함수내에서 데이터 변조 가능(파라미터를 추가하거나 제거 하는 등의 변조가 가능하다)
//callBackParam: 현재의 연산(조회) 후, 다음 연산이 정의 되어 있다면(Transaction 연산 - 위젯 세팅시, 컬럼타입으로 'ACTION' 을 통해 정의 가능) 다음 연산의 파라미터 값
indexInfo: { // 현재 작업의 기본 정보
index: 0 // 첫번째 그리드 조회
, op: 'findBtn1' // 연산의 트리거, DOM 상에서의 id 값
, seq: 1 // Transaction 연산의 순번, 현재 연산(조회)이 트랜잭션상의 첫번째 연산이면 1
, spec: 'ACTION' // 연산의 구분 ['FILTER', 'GRID', 'ACTION', 'JOB'] 등이 올 수 있다
, product: 'AMING' // 현재 연산(조회)의 Target 제품 ['AMING', 'MES', 'QMS', 'APS', 'WMS', 'SCM', ...]
}
retrieveCallBack: function(index, result, data, param, callBackParam, indexInfo){
//조회 후 호출되는 함수이다. 조회가 성공하여 얻은 데이터로 원하는 동작을 수행할 수 있다. (ex. 위젯에서 보여지는 데이터의 표기 변경 등, 변조 가능)
//index: 상기의 retrieveCallInit 과 동일(참조)
//result: 조회 성공 여부. 성공 시 SUCCESS, [SUCCESS, ERROR, FAIL]
//data: 조회로 받아온 JSON Array 데이터 값(만약, 조회된 데이터를 변조하고 싶다면, 데이터를 변경할 수 있다)
//param: 상기의 retrieveCallInit 과 동일(참조)
//callBackParam: 상기의 retrieveCallInit 과 동일(참조)
//indexInfo: 상기의 retrieveCallInit 과 동일(참조)
}
saveCallInit: function(index, param, callBackParam, indexInfo){
//저장/수정/삭제 시 연산 가장 맨앞에 호출되는 함수 저장의 경우, saveBtn, 저장/수정/삭제는 셀편집(수정) 또는 delLazyBtn 을 통해 삭제 후, saveAllBtn, upsertAllBtn을 사용했을 시 불리운다.
//index: 위젯 index (어떤 위젯에서 저장/수정/삭제가 발생되었는지, 순번은 0부터 시작: 0은 1번 grid를 의미함)
//param: 저장/수정/삭제할 데이터 값 (2차원 JSON 값 - JSON Array 형태, 원소가 1개이어도 [{}] 의 형태)이 전달되며, 함수내에서 데이터 변조 가능(개별 원소는 JSON key 'NEW' 값에 의해 저장/수정/삭제 - Y/U/D 를 확인할 수 있다)
//callBackParam: 현재의 연산(저장/수정/삭제) 후, 다음 연산이 정의 되어 있다면(Transaction 연산 - 위젯 세팅시, 컬럼타입으로 'ACTION' 을 통해 정의 가능) 다음 연산의 파라미터 값
indexInfo: { // 현재 작업의 기본 정보
index: 0 // 첫번째 그리드 저장/수정/삭제
, op: 'saveAllBtn1' // 연산의 트리거, DOM 상에서의 id 값
, seq: 1 // Transaction 연산의 순번, 현재의 연산(저장/수정/삭제)이 트랜잭션상의 첫번째 연산이면 1
, spec: 'ACTION' // 연산의 구분 ['FILTER', 'GRID', 'ACTION', 'JOB'] 등이 올 수 있다
, product: 'AMING' // 현재의 연산(저장/수정/삭제)의 Target 제품 ['AMING', 'MES', 'QMS', 'APS', 'WMS', 'SCM', ...]
}
saveCallBack: function(index, result, data, param, callBackParam, indexInfo){
//저장/수정/삭제 후 호출되는 함수이다. 저장의 성공/실패의 결과로 원하는 동작을 수행할 수 있다. saveBtn, saveAllBtn, upsertAllBtn 모두가 이 callBack 함수를 거친다.
//index: 상기의 saveCallInit 과 동일(참조)
//result: 저장/수정/삭제 성공 여부. 성공 시 SUCCESS, [SUCCESS, ERROR, FAIL]
//data: 저장/수정/삭제 결과의 JSON 데이터 값
//param: 상기의 saveCallInit 과 동일(참조)
//callBackParam: 상기의 saveCallInit 과 동일(참조)
//indexInfo: 상기의 saveCallInit 과 동일(참조)
}
delCallInit: function(index, param, callBackParam, indexInfo){
//HTML DOM 상에서, 기능버튼 delBtn(즉시 삭제) 연산시 맨앞에 호출되는 함수
//index: 위젯 index (어떤 위젯에서 삭제가 발생되었는지, 순번은 0부터 시작: 0은 1번 grid를 의미함)
//param: 삭제할 데이터 값 (2차원 JSON 값 - JSON Array 형태, 원소가 1개이어도 [{}] 의 형태)이 전달되며, 함수내에서 삭제할 데이터 변조 가능
//callBackParam: 현재의 연산(삭제) 후, 다음 연산이 정의 되어 있다면(Transaction 연산 - 위젯 세팅시, 컬럼타입으로 'ACTION' 을 통해 정의 가능) 다음 연산의 파라미터 값
indexInfo:{ // 현재 작업의 기본 정보
index: 0 // 첫번째 그리드 조회
, op: 'delBtn1' // 연산의 트리거, DOM 상에서의 id 값
, seq: 1 // Transaction 연산의 순번, 조회가 트랜잭션상의 첫번째 연산이면 1
, spec: 'ACTION' // 연산의 구분 ['FILTER', 'GRID', 'ACTION', 'JOB'] 등이 올 수 있다
, product: 'AMING' // 현재 조회 연산의 Target 제품 ['AMING', 'MES', 'QMS', 'APS', 'WMS', 'SCM', ...]
}
delCallBack: function(index, result, data, param, callBackParam, indexInfo){
//delBtn(즉시 삭제) 시 불리운다.
//index: 상기의 delCallInit 과 동일(참조)
//result: 삭제 성공 여부. 성공 시 SUCCESS, [SUCCESS, ERROR, FAIL]
//data: 삭제 결과의 JSON 데이터 값
//param: 상기의 delCallInit 과 동일(참조)
//callBackParam: 상기의 delCallInit 과 동일(참조)
//indexInfo: 상기의 delCallInit 과 동일(참조)
}
addRowCallInit: function(index, param, callBackParam, indexInfo){
//상단 행 추가 시 초기에 호출되는 함수이다. (ex. param에 값을 추가하여 원하는 데이터 바인딩 등)
//index: 위젯 index (어떤 위젯에서 삭제가 발생되었는지, 순번은 0부터 시작: 0은 1번 grid를 의미함)
//param: 새로 추가된 JSON 데이터가 전달된다(새로 행으로 추가된 데이터이므로 기본적으로 {'NEW': 'Y} 데이터가 전부이다. 새로 추가되는 행에 알고 있는 기본 정보를 추가할 수도 있다)
//callBackParam: 현재의 연산(행추가) 후, 다음 연산의 파라미터 값이지만 정의되어져 있는 것이 없으므로 거의 undefined 의 값이 넘어간다
indexInfo:{ // 현재 작업의 기본 정보
index: 0 // 첫번째 그리드 조회
, op: 'addBtn1' // 연산의 트리거, DOM 상에서의 id 값
, seq: 1 // Transaction 연산의 순번, 조회가 트랜잭션상의 첫번째 연산이면 1
, spec: 'JOB' // 연산의 구분 ['FILTER', 'GRID', 'ACTION', 'JOB'] 등이 올 수 있다
}
addRowCallBack: function(index, param, callBackParam, indexInfo){
//상단 행 추가 시 마지막에 호출되는 함수이다.
//index: 상기의 addRowCallInit 과 동일(참조)
//param: 상기의 addRowCallInit 과 동일(참조)
//callBackParam: 상기의 addRowCallInit 과 동일(참조)
//indexInfo: 상기의 addRowCallInit 과 동일(참조)
}
addBottomRowCallInit: function(index, param, callBackParam, indexInfo){
//하단 행 추가 시 초기에 호출되는 함수이다.(ex. param에 값을 추가하여 원하는 데이터 바인딩 등)
//index: 위젯 index (어떤 위젯에서 삭제가 발생되었는지, 순번은 0부터 시작: 0은 1번 grid를 의미함)
//param: 새로 추가된 JSON 데이터가 전달된다(새로 행으로 추가된 데이터이므로 기본적으로 {'NEW': 'Y} 데이터가 전부이다. 새로 추가되는 행에 알고 있는 기본 정보를 추가할 수도 있다)
//callBackParam: 현재의 연산(행추가) 후, 다음 연산의 파라미터 값이지만 정의되어져 있는 것이 없으므로 거의 undefined 의 값이 넘어간다
indexInfo:{ // 현재 작업의 기본 정보
index: 0 // 첫번째 그리드 조회
, op: 'addBottomBtn1'// 연산의 트리거, DOM 상에서의 id 값
, seq: 1 // Transaction 연산의 순번, 조회가 트랜잭션상의 첫번째 연산이면 1
, spec: 'JOB' // 연산의 구분 ['FILTER', 'GRID', 'ACTION', 'JOB'] 등이 올 수 있다
}
addBottomRowCallBack: function(index, param, callBackParam, indexInfo){
//하단 행 추가 시 마지막에 호출되는 함수이다.
//index: 상기의 addBottomRowCallInit 과 동일(참조)
//param: 상기의 addBottomRowInit 과 동일(참조)
//callBackParam: 상기의 addBottomRowInit 과 동일(참조)
//indexInfo: 상기의 addBottomRowInit 과 동일(참조)
}
excelDownCallInit: function(index, param, callBackParam, indexInfo){
//엑셀 다운 시 초기에 호출되는 함수이다. 엑셀을 내릴 때 형식, 컬럼 등을 변경하고 싶을 경우 사용할 수 있다.개별 페이지의 로컬 변수로 excelDownParam 이 undefined 가 아니면, 엑셀 다운로드 시, 위젯 세팅을 참고하는 것이 아닌 columnProperty 로서, excelDownParam 을 더 우선(재정의) 하여 따르게 된다. 엑셀 다운로드의 정책을 위젯 세팅이 아닌 변경하고 싶을 시, 사용할 수 있다(내리는 컬럼 수정(Show/Hide), 컬럼명, 배경색 etc..)
//index: 위젯 index (어떤 위젯에서 엑셀 다운로드가 발생되었는지, 순번은 0부터 시작: 0은 1번 grid를 의미함)
//param: to-be 데이터이며 현재는 undefined 값이 넘어 간다
//callBackParam: to-be 데이터이며 현재는 undefined 값이 넘어 간다
//indexInfo: 현재 작업의 기본 정보를 넘기나, to-be 데이터이며 현재는 undefined 값이 넘어 간다
}
excelViewDownCallInit: function(index, param, callBackParam, indexInfo){
//엑셀 뷰 다운(실 데이터보다 보여지는 데이터로 엑셀을 내리는) 시 초기에 호출되는 함수이다. 엑셀을 내릴 때 형식, 컬럼 등을 변경하고 싶을 경우 사용할 수 있다. 개별 페이지의 로컬 변수로 excelDownParam 이 undefined 가 아니면, 엑셀 다운로드 시, 위젯 세팅을 참고하는 것이 아닌 columnProperty 로서, excelDownParam 을 더 우선(재정의) 하여 따르게 된다. 엑셀 다운로드의 정책을 위젯 세팅이 아닌 변경하고 싶을 시, 사용할 수 있다(내리는 컬럼 수정(Show/Hide), 컬럼명, 배경색 etc..)
//index: 위젯 index (어떤 위젯에서 엑셀 다운로드가 발생되었는지, 순번은 0부터 시작: 0은 1번 grid를 의미함)
//param: to-be 데이터이며 현재는 undefined 값이 넘어 간다
//callBackParam: to-be 데이터이며 현재는 undefined 값이 넘어 간다
//indexInfo: 현재 작업의 기본 정보를 넘기나, to-be 데이터이며 현재는 undefined 값이 넘어 간다
}
excelGridCallBack: function(index){
//엑셀 업로드 시 콜백 함수이다. 방금 업로드한 데이터를 변경하고 싶은 경우 사용할 수 있다.
//index: 위젯 index (어떤 위젯에서 엑셀 업로드가 발생되었는지, 순번은 0부터 시작: 0은 1번 grid를 의미함)
}
openPopUpCallInit: function(index, e){
//팝업을 열 때 초기에 호출되는 함수이다.(ex. 필수입력사항 validation 체크, 선택된 행 클릭 시 열리는 팝업인 경우 선택된 상태인지 체크 등)
//index: 팝업 창 index (어떤 팝업이 열리고 있는지, 11번 팝업을 여는 중이면, index: 10)
//e: 팝업 이벤트 객체, target, offsetX, offsetY, type, altKey, … etc
}
openPopUpCallBack: function(idx, e)){
//팝업을 열고 난 후 호출되는 함수이다.(ex. 팝업의 value값 바인딩 등)
//index: 팝업 창 index (어떤 팝업을 열었는지, 11번 팝업을 열었다면, index: 10)
//e: 팝업 이벤트 객체, target, offsetX, offsetY, type, altKey, … etc
}
closePopUpCallInit: function(idx, e){
//팝업을 닫을 때 호출되는 함수이다.
//index: 팝업 창 index (어떤 팝업을 닫고 있는지, 11번 팝업을 닫는다면, index: 10)
//e: 팝업 이벤트 객체, target, offsetX, offsetY, type, altKey, … etc
}
closePopUpCallBack: function(idx, e){
//팝업을 닫고 난 후 호출되는 함수이다.(ex. 팝업이 열렸던 그리드의 행에 포커스 등)
//index: 팝업 창 index (어떤 팝업을 닫았는지, 11번 팝업을 닫았다면, index: 10)
//e: 팝업 이벤트 객체, target, offsetX, offsetY, type, altKey, … etc
}
cellEditBeginCallBack : function(index, e){
//셀 편집이 시작될 때 호출되는 함수이다.
//index: 셀편집 위젯 index (어떤 그리드에 대해 편집을 하려는지, 순번은 0부터 시작: 0은 1번 grid를 의미함)
//e: 셀편집 이벤트 객체, type, pid, item, dataField, rowIndex, columnIndex … etc
}
cellClickCallInit : function(index, e) {
//셀 클릭 시 호출되는 함수이다. 선택한 셀의 정보를 알 수 있고, 셀 클릭 시 원하는 동작을 수행할 수 있다.
//index: 셀클릭 위젯 index (어떤 그리드에 대해 클릭을 했는지, 순번은 0부터 시작: 0은 1번 grid를 의미함)
//e: 셀클릭 이벤트 객체, type, pid, item, dataField, rowIndex, columnIndex … etc
}
cellClickCallBack : function(index, e){
//셀 클릭 후에 호출되는 함수이다.
//index: 셀클릭 위젯 index (어떤 그리드에 대해 클릭을 했는지, 순번은 0부터 시작: 0은 1번 grid를 의미함)
//e: 셀클릭 이벤트 객체, type, pid, item, dataField, rowIndex, columnIndex … etc
}
cellEditEndBeforeCallBack : function(index, e){
//셀 편집 후 포커스가 나갈 때 호출되는 함수이다.
//index: 셀편집 위젯 index (어떤 그리드에 대해 편집을 했는지, 순번은 0부터 시작: 0은 1번 grid를 의미함)
//e: 셀편집 이벤트 객체, type, pid, item, dataField, rowIndex, columnIndex, value, oldValue … etc
}
pageLoadedCallBack : function(index, widget){
//페이지가 로딩되고 난 후 호출되는 함수이다.
//index: loaded 위젯 index (어떤 그리드에 대해 loading이 완료 되었는지, 순번은 0부터 시작: 0은 1번 grid를 의미함)
//widget: ngsWidget 객체를 전달해 준다
}
jqxComboBoxSelectCallBack : function(dataField, which, value){
//드롭다운 값을 선택할 때 호출되는 함수이다.
//dataField: 드롭다운의 데이터필드값
//which: 선택한 value의 index
//value: 선택한 value의 code
}
cellEditAutoValidateCallBack: function(index, e){
//Grid 편집모드일 경우 validate 할 함수를 반환한다.
return function(prevVal, inputVal, curVal) {
// 이전값 : prevVal, 입력된값 : inputVal, 현재 전체값 : curVal
if(e.dataField == "데이터필드") {
var pattern = /^[a-zA-Zs]+$/;
if (!pattern.test(inputVal) == true) { // 영어아닐 경우
return false;
}
}
return true;
//index: 셀편집 위젯 index (어떤 그리드에 대해 편집을 하려는지, 순번은 0부터 시작: 0은 1번 grid를 의미함)
//e: 셀편집 이벤트 객체, type, pid, item, dataField, rowIndex, columnIndex … etc
}
gridPropertyChangeCallBack: function(index, property){
//페이지가 로드될 때 실행되어 그리드 속성을 변경할 수 있다. Property를 return해주어야 한다.(ex. property[key] = value; return property)
//index: 위젯 index (default로 0)
//property: 해당 페이지의 widget 설정값
}
pageLoadedCallBack
page가 로드된 뒤 동작이 필요할 경우 사용하는 함수
pageLoadedCallBack: function(index, widget) {
$('#findBtn1').trigger('click');
},findBtn은 검색 버튼으로 Gird 별로 생성하고 findBtn1을 제외한 2,3... 다른 버튼은 숨김 처리 한다.
Last updated