기타 Column 값의 따라 Button 보이고 숨기기
추천0 비추천 0
페이지 정보
작성자 김끄으으비
작성일 2023-09-10 10:03 조회 507회
댓글 0건
제품 버전 : JS LIB
본문
관련링크
안녕하세요 아래 사진과 같이 어떠한 한 열의 값에 따라 버튼이 보이고 숨기기를 하고 싶은데 어떻게 하면 이 문제를 풀 수 있을지 몰라 여기다가 남깁니다.
console.log('document.readyState >> ' + document.readyState);
document.readyState === 'complete' ? init() : window.onload = init;
function init() {
console.log("hello customer in other js >> ");
var grid;
var data = [];
var cashYNList =[];
LCC.addMessageHandler(message => messageHandler(message));
var lostReasonList = [];
var relationship =[];
var bankverify = [];
var wijmoParam = {
listClassCode : ['PW013', 'PW014', 'SB024', 'SB002', 'DR009']
};
//모든picklist불러오는 곳은 이렇게 정의를 하여서 동기화를 하여 동기화를 한후 처리한다
async function getSMCodePicklist() {
try {
const result = await apex.searchPick(wijmoParam, 'getSMCodePicklist');
console.log('getSMCodePicklist result: ', result);
bankverify = [...result['SB002']];
console.log('getSMCodePicklist result: ', bankverify);
relationship = [...result['DR009']];
lostReasonList = [...result['PW013']];
console.log('lostReasonList >> ' + JSON.stringify(lostReasonList));
cashYNList= [...result['SB024']];
console.log('cashYNList >> ' + JSON.stringify(cashYNList));
} catch (e) {
console.log('getSMCodePicklist error: ', e);
}
}
getSMCodePicklist().then(()=>{
let colGroup = [
{ binding: 'team', header: '팀', width: 83, align: 'center', isReadOnly: true },
{ binding: 'centerCode', header: '센터명', width: 83, align: 'center', isReadOnly: true },
{ binding: 'businessType', header: '업무구분', width: 83, align: 'center', isReadOnly: true },
{ binding: 'salesNum', header: '판매번호', width: 83, align: 'center', isReadOnly: true },
{ binding: 'salesDate', header: '적자일시', width: 83, align: 'center', isReadOnly: true },
//{ binding: 'collectionType', header: '수금유형', width: 83, align: 'center', isReadOnly: true },
{ binding: 'collectionType', header: '현금송금유형', width: 83,align: 'center', isReadOnly: false, cssClassAll: 'edit-column', isRequired : false
,editor: new wijmo.input.ComboBox(document.createElement('div'), {displayMemberPath: 'name', itemsSource : cashYNList, isRequired : false})
//,editor: new wijmo.input.ComboBox(document.createElement('div'), { itemsSource : lostReasonList})
},
{ binding: 'paymentType', header: '결제유형', width: 83, align: 'center', isReadOnly: true },
{ binding: 'agreeDate', header: '승인일/처리일', width: 83, align: 'center', isReadOnly: true },
{ binding: 'remittanceDate', header: '송금예정일', width: 83, align: 'center', isReadOnly: true },
{ binding: 'collectionDate', header: '수금일자', width: 83, align: 'center', isReadOnly: true },
{ binding: 'buyerName', header: '고객명', width: 83, align: 'center', isReadOnly: true },
{ binding: 'dipositor', header: '예금주', width: 83, align: 'center', isReadOnly: false, cssClassAll: 'cell-edit' },
{ binding: 'sex', header: '관계', width: 83,align: 'center', isReadOnly: false, cssClassAll: 'cell-edit', isRequired:false
,editor: new wijmo.input.ComboBox(document.createElement('div'), {displayMemberPath: 'name', itemsSource : relationship, isRequired:false})
//,editor: new wijmo.input.ComboBox(document.createElement('div'), { itemsSource : lostReasonList})
},
{ binding: 'bankName', header: '은행명', width: 83,align: 'center', isReadOnly: false, cssClassAll: 'cell-edit', isRequired:false
,editor: new wijmo.input.ComboBox(document.createElement('div'), {displayMemberPath: 'name', itemsSource : bankverify,
selectedValuePath : "key", isRequired:false})
//,editor: new wijmo.input.ComboBox(document.createElement('div'), { itemsSource : lostReasonList})
},
{ binding: 'bankAccountNum', header: '계좌번호', width: 83, align: 'center', cssClassAll: 'cell-edit', isReadOnly: false },
{ binding: 'bankVerifyCheckStatus', header: '계좌확인여부', width: 83, align: 'center', isReadOnly: true },
{ binding: 'bankVerifyCheck', header: '현금취소', width: 60, align: 'center', isReadOnly: true
, cellTemplate: wijmo.grid.cellmaker.CellMaker.makeButton({
text: '계좌확인',
click: (e, ctx) => {
let item = ctx.item;
console.log(item+'TEXT BANK BUTTON');
LCC.sendMessage({'type':'getVerifyCheckOnBank', item});
}
})
},
{ binding: 'cardVerifycheck', header: '카드취소', width: 60, align: 'center', isReadOnly: true
, cellTemplate: wijmo.grid.cellmaker.CellMaker.makeButton({
text: '카드취소',
click: (e, ctx) => {
let item = ctx.item;
console.log(item+'TEXT Card BUTTON');
LCC.sendMessage({'type':'getVerifyCardCheck', item});
}
})
},
{ binding: '포인트취소', header: '포인트취소', width: 60, align: 'center', isReadOnly: true
, cellTemplate: wijmo.grid.cellmaker.CellMaker.makeButton({
text: '포인트취소',
click: (e, ctx) => {
let item = ctx.item;
console.log(item+'Point BUTTON');
LCC.sendMessage({'type':'getVerifyPointCheck', item});
}
})
},
{ binding: 'remittance', header: '결제금액', width: 83, align: 'center', isReadOnly: true },
{ binding: 'note', header: '비고', width: 83, align: 'center', isReadOnly: true },
{ binding: 'evidence', header: '증빙', width: 83, align: 'center', isReadOnly: true },
{ binding: 'processingSm', header: '처리SM', width: 83, align: 'center', isReadOnly: true },
{
header: '센터장', width: 83, align: 'center', columns: [
{ binding: 'centerApproval', header: '승인', width: 83, align: 'center', isReadOnly: true },
{ binding: 'centerApprovalDatetime', header: '일시', width: 83, align: 'center', isReadOnly: true }
]
},
{
header: '재무팀', width: 83, align: 'center', columns: [
{ binding: 'financeCheck', header: '확인', width: 83, align: 'center', isReadOnly: true },
{ binding: 'financeCheckDatetime', header: '일시', width: 83, align: 'center', isReadOnly: true }
]
},
{
header: '완료', width: 83, align: 'center', columns: [
{ binding: 'remittanceCheck', header: '송금', width: 83, align: 'center', isReadOnly: true },
{ binding: 'remittanceCheckDatetime', header: '일시', width: 83, align: 'center', isReadOnly: true }
]
},
];
let dragIndex;
// create the Grid
grid = new wijmo.grid.FlexGrid("#theGrid",{
stickyHeaders: true,
headersVisibility: 'Column',
alternatingRowStep: 0,
showMarquee: true,
autoGenerateColumns: false,
// allowSorting: wijmo.grid.AllowSorting.MultiColumn,
showSort: false,
itemsSource : data,
columnGroups: colGroup,
selectionChanging: function (s,e) {
},
cellEditEnding: (s, e) => {
var selectedItems = s.selectedItems[0];
var selectedRow = e.row;
var editItem = s.rows[selectedRow].dataItem;
var selectedCol = e.col;
var editValue = s.activeEditor.value;
let col = s.columns[e.col];
if(col.binding == 'dipositor'){
editItem.dipositor = editValue;
var custName = grid.getCellData(selectedRow,'buyerName',false);
console.log('위즈모요'+custName);
}
if(col.binding == 'sex'){
editItem.sex = editValue;
}
if(col.binding == 'bankAccountNum'){
editItem.bankAccountNum = editValue;
}
if(col.binding == 'bankName'){
// 'bankName' 필드에 대한 ComboBox 인스턴스를 가져옵니다.
//var comboBox = grid.columns.getColumn('bankName').editor;
// 선택된 항목의 key 값을 가져옵니다.
editItem.bankName = editValue;
}
if(col.binding == 'collectionType'){
editItem.collectionType = editValue;
}
}
});
grid.headersVisibility = wijmo.grid.HeadersVisibility.All;
// new wijmo.grid.filter.FlexGridFilter(grid,{
// filterColumns: [
// 'saleNumber',
// ]
// });
var tip = new wijmo.Tooltip(),
rng = null;
function setSelectedItem() {
let listSelectedItem = [];
grid.rows.filter(r => r.isSelected).forEach((item, index) => {
listSelectedItem.push(item.dataItem);
});
LCC.sendMessage({'type':'selectedItem', 'itemValue': listSelectedItem});
}
grid.formatItem.addHandler(function (s,e){
//s.columns[e.col].binding=='lostQty'
var lostQty = s.getCellData(e.row,'collectionType');
if (e.panel === s.cells) {
if(s.columns[e.col].binding=='collectionType'){
}
}
});
// Tooltip Show Event
grid.hostElement.addEventListener('mousemove', function (e) {
var ht = grid.hitTest(e.pageX, e.pageY);
if (!ht.range.equals(rng)) {
if (ht.cellType == wijmo.grid.CellType.Cell && (ht.col != 2 && ht.col != 9 && ht.col != 13 && ht.col != 16)) {
rng = ht.range;
var cellElement = document.elementFromPoint(e.clientX, e.clientY),
cellBounds = grid.getCellBoundingRect(ht.row, ht.col),
data = wijmo.escapeHtml(grid.getCellData(rng.row, rng.col, true));
if (cellElement.className.indexOf('wj-cell') > -1) {
tip.show(grid.hostElement, data, cellBounds);
} else {
tip.hide();
}
}
}
});
// Tooltip Hide Event
grid.hostElement.addEventListener('mouseout', function (e) {
tip.hide();
rng = null;
});
// Double Click Event
grid.hostElement.addEventListener('dblclick', function(e) {
console.log('Double Click');
var ht = grid.hitTest(e.pageX, e.pageY);
var col = ht.col;
var row = ht.row;
if (ht.panel === grid.cells) {
var item = ht.panel.rows[row].dataItem;
var binding = grid.columns[col].binding;
//var getDiv ;
// let ahref;
//document.querySelector(".fileUrl").remove();
if(binding == 'internalFile') {
//item.internalFileUrl.forEach(index => {
LCC.sendMessage({'type':'filelistLoad', item});
} else if(binding == 'custName') {
//item.internalFileUrl.forEach(index => {
//LCC.sendMessage({'type':'contactChange', item});
} else {
//TODO alert창 띄우기
console.log('파일 URL 존재하지 않음');
}
}
LCC.sendMessage({'type':'dblclick', item});
});
// onClick Event
grid.hostElement.addEventListener('click', function(e) {
console.log('onClick');
var ht = grid.hitTest(e.pageX, e.pageY);
var col = ht.col;
var row = ht.row;
grid._focus = false;
if (e.target.type === 'checkbox') {
console.log('checkbox');
var selected = grid.selectedRows;
var selectedList = [];
var mocklist = [];
var receipt = [];
//리스트
selected.forEach(item => {
mocklist.push(item.dataItem);
});
//영수증
selected.forEach(item => {
receipt.push(item.dataItem);
});
//판매저장
selected.forEach(item => {
selectedList.push(item.dataItem);
});
LCC.sendMessage({'type':'check', selectedList});
}
});
});
// Message Event (from Salesforce) Handler
const messageHandler = (message) => {
console.log('messageHandler', message.name);
var rowItem = [];
// // column footers
// function footersOn(theGrid) {
// if (theGrid.columnFooters.rows.length == 0) {
// var row = new wijmo.grid.GroupRow();
// theGrid.columnFooters.rows.push(row);
// theGrid.bottomLeftCells.setCellData(0, 0, 'Σ');
// }
// }
// function footersOff(theGrid) {
// theGrid.columnFooters.rows.clear();
// }
switch (message.name.type){
case 'clearRows' :
var setRemoveColIdx = new Set();
var listBindingTarget = ['lostReason','test','lostReasonEtc','lostQty'];
grid.columns.forEach(column => {
if(listBindingTarget.indexOf(column.binding) != -1) {
setRemoveColIdx.add(column.index);
}
});
var setToArr = Array.from(setRemoveColIdx);
grid.rows.forEach(row =>{
var index = row.index;
grid.rows[index].isSelected = false;
setToArr.forEach(colIdx => {
grid.setCellData(index, colIdx, null);
});
});
grid.collectionView.refresh();
//grid.rows.clear();
//collectionView.refresh();
break;
case 'removeRow' :
var selectedIdx = [];
grid.selectedRows.forEach(selectedRows => {
var idx = selectedRows._idx;
var isSelectorChecked = grid.rows[idx].isSelected;
if(isSelectorChecked){
selectedIdx.push(idx);
}
});
selectedIdx.reverse();
console.log("selectedIdx :: " + selectedIdx);
for(var i = 0; i < selectedIdx.length; i++){
grid.rows.splice(selectedIdx[i], 1);
}
// 그리드 삭제 후 SF에 송신해서 attribute set
grid.rows.forEach(rows => {
rowItem.push(rows.dataItem);
});
console.log("Wijmo Return rowItem :: " + JSON.stringify(rowItem));
LCC.sendMessage({'type':'getRowItem', rowItem});
console.log("Wij removeRow end");
break;
case 'getRowItem' :
grid.rows.forEach(rows => {
rowItem.push(rows.dataItem);
});
console.log("Wijmo Return rowItem :: " + JSON.stringify(rowItem));
LCC.sendMessage({'type':'getRowItem', rowItem});
break;
case 'clearRow' :
console.log('clearRow >> ');
grid.rows.clear();
break;
case 'changeTab' :
console.log('changeTab >> ' + grid.columnFooters.rows.length);
grid.rows.clear();
if (grid.columnFooters.rows.length == 1) {
grid.columnFooters.rows.clear();
}
break;
case 'addItem':
console.log('addItem');
console.log('messageHandler', JSON.stringify(message.name.item));
var items = message.name.item;
var row = new wijmo.grid.Row();
row.dataItem = items;
grid.rows.push(row);
console.log("Wij addItem end");
grid.rows.forEach(rows => {
rowItem.push(rows.dataItem);
});
console.log("Wijmo Return rowItem :: " + JSON.stringify(rowItem));
LCC.sendMessage({'type':'getRowItem', rowItem});
break;
case 'addList':
console.log('addList ::');
var itemList = message.name.item;
console.log('addList ::'+ itemList);
// data.splice(0,data.length);
itemList.forEach(items => {
var row = new wijmo.grid.Row();
row.dataItem = items;
console.log(JSON.stringify(row.dataItem));
grid.rows.push(row);
//data.push(items);
});
grid.itemsSource = itemList;
console.log("Wij addList end");
break;
case 'check':
var selected = grid.selectedRows;
var selectedList = [];
selected.forEach(item => {
selectedList.push(item._idx);
})
console.log('selecteselectedd',selectedList);
var selectedListSize = selectedList.length;
LCC.sendMessage({'type':'check', selectedListSize});
break;
case 'setSum':
//합계row 업데이트
// grid.rows.push(aggregateRow);
console.log('몇번타요?66666계산');
updateAggregateRow();
break;
case 'downloadExcel' :
let selectedR = [];
grid.rows.forEach(row => {
if(row.isSelected) {
selectedR.push(row.dataItem);
}
});
console.log('downloadExcel selectedR >>> ' + JSON.stringify(selectedR));
try {
var book = wijmo.grid.xlsx.FlexGridXlsxConverter.saveAsync(grid,{
includeColumnHeaders: true,
includeRowHeaders: false,
formatItem:null
}, '판매내역관리.xlsx');
}
catch (ex) {
console.error('에러;', ex);
}
break;
}
};
};
const apex = {
// Lookup 필드 검색
search: (query, methodName) => {
return new Promise((resolve, reject) => {
Visualforce.remoting.Manager.invokeAction(
`Wijmo_RequestPartsController.` + methodName,
query,
(result, event) => {
resolve(result);
},
{escape: false},
{buffer: false}
);
});
},
// Picklist 검색
searchPick: (wijmoParam, methodName) => {
return new Promise((resolve, reject) => {
Visualforce.remoting.Manager.invokeAction(
`Wijmo_RequestPartsController.` + methodName,
wijmoParam,
(result, event) => {
resolve(result);
console.log('getSMCodePicklist result: ', result);
//console.log('getSMCodePicklist result : ', result);
try {
lostReasonList = [...result['PW013']];
console.log('lostReasonList >> ' + JSON.stringify(lostReasonList));
} catch(e) {
console.log('getSMCodePicklist e : ', e);
}
},
{escape: false},
{buffer: false}
);
});
},
};
// Lookup 관련
const lookup = {
refineLookupItems: (result, callback) => {
console.log('result : ', result);
let items = [];
items = [...result];
callback(items);
},
// Lookup - ItemsSourceFunction
lookupItemsSourceFunction: (query, max, callback, methodName) => {
console.log('query : ' + query);
apex.search(query, methodName)
.then(result => {
console.log('result : ', result);
lookup.refineLookupItems(result, callback);
});
},
};
댓글목록
등록된 댓글이 없습니다.
1 답변
