Skip to content
Projects
Groups
Snippets
Help
Loading...
Help
Submit feedback
Contribute to GitLab
Sign in
Toggle navigation
T
Tia-dev
Project
Project
Details
Activity
Releases
Cycle Analytics
Repository
Repository
Files
Commits
Branches
Tags
Contributors
Graph
Compare
Charts
Issues
0
Issues
0
List
Board
Labels
Milestones
Merge Requests
0
Merge Requests
0
CI / CD
CI / CD
Pipelines
Jobs
Schedules
Charts
Wiki
Wiki
Snippets
Snippets
Members
Members
Collapse sidebar
Close sidebar
Activity
Graph
Charts
Create a new issue
Jobs
Commits
Issue Boards
Open sidebar
Dida Adams Arizona
Tia-dev
Commits
afeff22f
Commit
afeff22f
authored
Sep 03, 2020
by
Deni Rinaldi
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
fixedColumn
parent
e8650ce6
Changes
2
Hide whitespace changes
Inline
Side-by-side
Showing
2 changed files
with
209 additions
and
9 deletions
+209
-9
BalanceSheet.js
src/container/BudgetTahunan/BalanceSheet.js
+8
-8
CustomTable.js
src/library/CustomTable.js
+201
-1
No files found.
src/container/BudgetTahunan/BalanceSheet.js
View file @
afeff22f
...
...
@@ -7,14 +7,14 @@ import AddIcon from '@material-ui/icons/Add';
import { values } from 'ramda';
var ct = require("../../library/CustomTable");
const
getMuiTheme
=
()
=>
createMuiTheme
(
ct
.
customTable
());
const getMuiTheme = () => createMuiTheme(ct.customTable
3
());
const options = ct.customOptionsFixedColumn();
const style = {
position: "sticky",
left: 0,
background
:
"white"
,
zIndex: 101,
background: "white",
};
const style2 = {
position: "sticky",
...
...
@@ -764,20 +764,20 @@ export default class BalanceSheet extends Component {
name: "Account",
options: {
customHeadRender: (columnMeta) => (
<
TableCell
key
=
{
columnMeta
.
index
}
style
=
{{
...
style
,
top
:
0
,
zIndex
:
102
,
backgroundColor
:
'#354960'
,
width
:
3
88
}}
>
<TableCell key={columnMeta.index} style={{ ...style, top: 0, zIndex: 102, backgroundColor: '#354960', width: 3
00
}}>
<Typography style={{ color: 'white', fontSize: 12, fontWeight: 'bold', textAlign: 'left' }}>{columnMeta.name}</Typography>
</TableCell>
),
setCellProps: () => ({ style }),
customBodyRender: (val, tableMeta) => {
return (
<
div
style
=
{{
width
:
3
88
}}
>
<div style={{ width: 3
00
}}>
{tableMeta.rowData[4] == 0 ?
<span style={{ fontSize: 12, fontWeight: 'bold' }}>{String(tableMeta.rowData[0] === 4 ? "" : val).toUpperCase()}</span>
:
tableMeta
.
rowData
[
4
]
===
1
?
<
span
style
=
{{
fontSize
:
12
,
marginLeft
:
20
*
Number
(
tableMeta
.
rowData
[
4
])
}}
>
{
tableMeta
.
rowData
[
0
]
===
4
?
""
:
val
}
<
/span>
:
<
span
style
=
{{
fontSize
:
12
,
marginLeft
:
20
*
Number
(
tableMeta
.
rowData
[
4
])
}}
>
{
tableMeta
.
rowData
[
0
]
===
4
?
""
:
val
}
<
/span
>
<div style={{ paddingLeft: 20 * Number(tableMeta.rowData[4]) }}>
<span style={{ fontSize: 12
}}>{tableMeta.rowData[0] === 4 ? "" : val}</span>
</div
>
}
</div>
)
...
...
@@ -1957,7 +1957,7 @@ export default class BalanceSheet extends Component {
<Typography style={{ fontSize: '11px', color: '#4b4b4b' }}>in IDR mn</Typography>
</div>
<
div
style
=
{{
marginTop
:
20
,
width
:
this
.
props
.
width
-
200
,
height
:
this
.
props
.
height
-
2
00
}}
>
<div style={{ marginTop: 20, width: this.props.width - 200, height: this.props.height
- 4
00 }}>
<MuiThemeProvider theme={getMuiTheme()}>
<MUIDataTable
data={dataTable2}
...
...
src/library/CustomTable.js
View file @
afeff22f
...
...
@@ -318,6 +318,206 @@ exports.customTable2 = function () {
}
}
exports
.
customTable3
=
function
()
{
return
{
typography
:
{
useNextVariants
:
true
,
},
overrides
:
{
MUIDataTable
:
{
paper
:
{
position
:
'relative'
,
// width: '100% !important',
boxShadow
:
"0 0 0 0 rgba(154,161,171,.15)"
,
border
:
"1px rgba(0,0,0,0.1) solid"
,
borderRadius
:
"10px"
,
overflow
:
"hidden"
,
},
// responsiveScroll: {
// position: 'relative',
// width: '100% !important',
// }
responsiveScrollMaxHeight
:
{
height
:
650
,
maxHeight
:
650
},
},
MuiToolbar
:
{
root
:
{
position
:
'relative'
,
}
},
MUIDataTableToolbar
:
{
root
:
{
position
:
'relative'
,
padding
:
"0px 15px"
,
backgroundColor
:
'#f2f6fa'
,
//'rgba(0,76,151,0.05)',
},
titleText
:
{
color
:
"#555"
},
icon
:
{
color
:
"#555 !important"
},
iconActive
:
{
color
:
"#555 !important"
},
left
:
{
flex
:
"0 0 auto !important"
},
actions
:
{
flex
:
"1 0 auto !important"
}
},
MUIDataTableSearch
:
{
main
:
{
position
:
'absolute'
,
top
:
"0"
,
right
:
"-9px"
,
width
:
"350px !important"
,
backgroundColor
:
"#f2f6fa"
,
zIndex
:
"10"
,
textAlign
:
"right"
,
display
:
"block"
,
},
searchIcon
:
{
width
:
"50px !important"
,
color
:
"#555 !important"
,
display
:
"inline-block"
,
textAlign
:
"center"
,
verticalAlign
:
"top"
,
},
searchText
:
{
width
:
"calc(100% - 120px) !important"
,
marginRight
:
"10px"
,
color
:
"#555 !important"
,
display
:
"inline-block"
,
verticalAlign
:
"top"
,
},
clearIcon
:
{
width
:
"50px !important"
,
color
:
"#555 !important"
,
display
:
"inline-block"
,
verticalAlign
:
"top"
,
},
},
MuiTableCell
:
{
root
:
{
display
:
'table-cell'
,
padding
:
7
,
paddingLeft
:
25
,
fontSize
:
'0.875rem'
,
textAlign
:
'left'
,
fontFamily
:
"Roboto, Helvetica, Arial, sans-serif"
,
fontWeight
:
400
,
lineHeight
:
1.43
,
borderBottom
:
'1px solid rgba(224, 224, 224, 1)'
,
letterSpacing
:
'0.01071em'
,
verticalAlign
:
'inherit'
,
}
},
MUIDataTableHead
:
{
main
:
{
position
:
'relative'
,
backgroundColor
:
mainColor
,
color
:
"#555"
,
// display: "flex",
// alignItems: "stretch"
},
fixedHeader
:
{
// position: "relative",
borderBottom
:
"1px rgba(0,0,0,0.1) solid"
,
backgroundColor
:
'#f2f6fa'
,
//'rgba(0,76,151,0.05)',
color
:
"#555"
,
padding
:
"10px 20px"
,
height
:
"auto"
},
},
MUIDataTableHeadRow
:
{
root
:
{
position
:
'relative'
,
backgroundColor
:
mainColor
,
}
},
MUIDataTableHeadCell
:
{
root
:
{
fontSize
:
"10pt"
,
fontWeight
:
"500"
,
color
:
"#555"
,
backgroundColor
:
secondColor
,
},
fixedHeader
:
{
// position: "relative",
borderBottom
:
"1px rgba(0,0,0,0.1) solid"
,
backgroundColor
:
'#f2f6fa'
,
//'rgba(0,76,151,0.05)',
color
:
"#555"
,
padding
:
"10px 25px"
,
height
:
"auto"
},
toolButton
:
{
display
:
"flex"
,
height
:
"auto"
,
},
data
:
{
display
:
"inline-block"
,
verticalAlign
:
"top"
,
},
sortActive
:
{
color
:
"#555"
},
sortAction
:
{
color
:
"#555"
,
display
:
"inline-block"
,
verticalAlign
:
"top"
,
MuiButtonBase
:
{
color
:
"#555"
,
root
:
{
color
:
"#555"
,
}
}
}
},
MUIDataTableBodyCell
:
{
root
:
{
position
:
'relative'
,
fontSize
:
"13px"
,
}
},
MUIDataTableSelectCell
:
{
headerCell
:
{
backgroundColor
:
secondColor
,
checkboxRoot
:
{
color
:
"#555"
,
}
},
checkboxRoot
:
{
color
:
"#555"
}
},
MuiInput
:
{
root
:
{
top
:
"5px"
,
color
:
"#555 !important"
,
},
underline
:
{
borderBottom
:
"1px #555 solid !important"
,
}
},
MuiSelect
:
{
root
:
{
top
:
"0"
,
color
:
"#555 !important"
,
},
}
// MuiIconButton: {
// root: {
// color: "#fff !important",
// }
// }
}
}
}
exports
.
customOptions
=
function
()
{
return
{
// selectableRows: false,
...
...
@@ -358,7 +558,7 @@ exports.customOptionsFixedColumn = function () {
sort
:
false
,
responsive
:
'scrollMaxHeight'
,
viewColumns
:
false
,
overflowX
:
'auto'
,
//
overflowX: 'auto',
print
:
false
,
download
:
false
,
elevation
:
5
,
...
...
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment