fix: grid cell style

main
Jonguk. Lim 2 years ago
parent 6c81a61eb1
commit a29e302bc2

@ -128,3 +128,25 @@ access token : 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
<%@include file="/WEB-INF/jsp/framework/biz-popup-btn.jsp"%>
```
#### columns style
```js
{
header: '롤 명',
name: 'roleNm',
width: 150,
sortingType: 'desc',
sortable: true,
filter: 'select',
renderer: {
styles: {
//fontWeight: 'bold',
background: (props) => props.value === 'Y' ? 'cyan' : 'red'
},
attributes: {
'data-type': 'default',
title: (props) => `title: ${props.formattedValue}`
},
classNames: ['blue']
}
}
```

@ -65,6 +65,10 @@
const fnBiz = {
search: () => {
GRID.reloadData();
//TODO : onGridUpdated
GRID.on('onGridUpdated', (ev) => {
console.log('%%%%%%%%%%%%%>>>>>>>',ev)
}) // 그리드 레이아웃 새로고침 (로드가 다 되지 않는 경우 그리드가 흰색 화면으로 출력될 때가 있다.))
}
,add: () => {
const arrChecks = GRID.getCheckedRows();
@ -130,10 +134,8 @@
},
{
header: '등록여부',
headerCellClass: 'blue',
name: 'regYn',
copyOptions: {
useListItemText: true
},
width: 60,
align: 'center',
sortable: true,
@ -154,13 +156,12 @@
]
}
},
onBeforeChange: function(ev) { //변경 전(ev.value)/후(ev.nextValue)
// console.log('Grade before change:' + ev);
},
onAfterChange: function(ev) { //변경 전(ev.prevValue)/후(ev.value)
// console.log('Grade after change:' + ev);
//TODO : 컬럼 스타일 : README.md 참조
renderer: {
styles: {
background: (props) => props.value === 'Y' ? 'cyan' : 'red'
}
}
/* //에디터 적용 */
},
{
header: '롤 패턴',
@ -206,20 +207,24 @@
el: 'grid',
rowHeaders: ['rowNum', 'checkbox'],
columns: gridColumns,
pageOptions: {
useClient: true,
perPage: 100
},
//TODO : 페이징 미사용시
//페이지처리 hide
pagination: false,
pageOptions: null,
// pageOptions: {
// useClient: true,
// perPage: 100
// },
columnOptions: {
frozenCount: 3
},
bodyHeight: 400
bodyHeight: 400,
onGridMounted: (ev)=>{
console.log('mounted~~~~~~~~',ev)
}
};
const gridDatasource = { //DataSource
/* -----------------------
* DataSource API Setting
----------------------- */
initialRequest: true, // 화면 load시 조회 안함 - default
api: {
readData: {
@ -230,7 +235,10 @@
}
};
GRID = TuiGrid.of(gridOptions, gridDatasource, (res) => {
GRID = TuiGrid.of(gridOptions, gridDatasource, (ev) => {
console.table('---------->>>',ev)
console.log('---------->>>',ev.instance)
console.log('---------->>>',ev.responseData)
});
}

@ -180,10 +180,9 @@
name: 'authorCode',
width: 120,
sortable: true,
filter: 'select',
formatter: 'listItemText',
editor: {
type: "select",
type: "radio",
options: {
listItems: [
<c:forEach var="row" items="${authorList}" varStatus="status">

@ -402,6 +402,14 @@ function setDateFmt(srcDateStr, delimiter = '-') {
}
}
/**
* <pre>
* form의 element data를 json data로 return
* form 내의 element name 필수
* </pre>
* @param {Object} formObj form Object
* @returns {Object} json Object
*/
function getFormJson(formObj) {
// Getting an FormData
let data = new FormData(formObj);
@ -413,6 +421,14 @@ function getFormJson(formObj) {
//console.log(JSON.stringify(serializedFormData));
}
/**
* <pre>
* FormData(new FormData(formObj)) json Object로 return
* form 내의 element의 name 필수
* </pre>
* @param formData new FormData(formObj) 형태의 데이타
* @returns {Object} json Object
*/
function serialize (formData) {
let rtnData = {};

@ -157,7 +157,8 @@ const TuiGrid = {
console.log('totCnt >>>>> ',$('#totCnt span').text())
}
if(successCallback) successCallback(JSON.parse(ev.xhr.response));
//if(successCallback) successCallback(JSON.parse(ev.xhr.response));
if(successCallback) successCallback(ev);
});
// 결과가 false인 경우 발생한 경우
this.instance.on('failResponse', function(ev){

Loading…
Cancel
Save