Skip to content

T
Tia-dev
Commit e8650ce6 authored by Deni Rinaldi's avatar Deni Rinaldi
Browse files
Options

fixheader column

parent 3629fd5d
Hide whitespace changes
Inline Side-by-side
Showing with 54 additions and 31 deletions
src/container/BudgetTahunan.js
View file @ e8650ce6
......@@ -559,6 +559,8 @@ export default class BudgetTahunan extends Component {
{this.state.visibleBS && (
<BalanceSheet
report_id={this.state.report_id}
height={this.props.height}
width={this.props.width}
company={this.state.company}
revision={this.state.revisionTable}
periode={this.state.periode.periode}
......
src/container/BudgetTahunan/BalanceSheet.js
View file @ e8650ce6
......@@ -18,9 +18,8 @@ const style = {
};
const style2 = {
position: "sticky",
left: 420,
background: "white",
zIndex: 101
zIndex: 100
};
export default class BalanceSheet extends Component {
......@@ -788,10 +787,11 @@ export default class BalanceSheet extends Component {
name: "31 Dec 2020 Actual",
options: {
customHeadRender: (columnMeta) => (
<TableCell style={{ backgroundColor: '#354960', width: 96 }}>
<TableCell style={{ ...style2, top: 0, zIndex: 99, backgroundColor: '#354960', width: 96 }}>
<Typography style={{ color: 'white', fontSize: 12, fontWeight: 'bold', textAlign: 'center' }}>{columnMeta.name}</Typography>
</TableCell>
),
setCellProps: () => ({ style2 }),
customBodyRender: (value, tableMeta, updateValue) => {
return (
<div style={{ textAlign: 'right' }}>
......@@ -859,10 +859,11 @@ export default class BalanceSheet extends Component {
name: "January 2021",
options: {
customHeadRender: (columnMeta) => (
<TableCell style={{ backgroundColor: '#354960', width: 96 }}>
<TableCell style={{ ...style2, top: 0, zIndex: 99, backgroundColor: '#354960', width: 96 }}>
<Typography style={{ color: 'white', fontSize: 12, fontWeight: 'bold', textAlign: 'center' }}>{columnMeta.name}</Typography>
</TableCell>
),
setCellProps: () => ({ style2 }),
customBodyRender: (value, tableMeta, updateValue) => {
return (
<div style={{ textAlign: 'right' }}>
......@@ -930,10 +931,11 @@ export default class BalanceSheet extends Component {
name: "February 2021",
options: {
customHeadRender: (columnMeta) => (
<TableCell style={{ backgroundColor: '#354960', width: 96 }}>
<TableCell style={{ ...style2, top: 0, zIndex: 99, backgroundColor: '#354960', width: 96 }}>
<Typography style={{ color: 'white', fontSize: 12, fontWeight: 'bold', textAlign: 'center' }}>{columnMeta.name}</Typography>
</TableCell>
),
setCellProps: () => ({ style2 }),
customBodyRender: (value, tableMeta, updateValue) => {
return (
<div style={{ textAlign: 'right' }}>
......@@ -1001,10 +1003,11 @@ export default class BalanceSheet extends Component {
name: "March 2021",
options: {
customHeadRender: (columnMeta) => (
<TableCell style={{ backgroundColor: '#354960', width: 96 }}>
<TableCell style={{ ...style2, top: 0, zIndex: 99, backgroundColor: '#354960', width: 96 }}>
<Typography style={{ color: 'white', fontSize: 12, fontWeight: 'bold', textAlign: 'center' }}>{columnMeta.name}</Typography>
</TableCell>
),
setCellProps: () => ({ style2 }),
customBodyRender: (value, tableMeta, updateValue) => {
return (
<div style={{ textAlign: 'right' }}>
......@@ -1072,10 +1075,11 @@ export default class BalanceSheet extends Component {
name: "April 2021",
options: {
customHeadRender: (columnMeta) => (
<TableCell style={{ backgroundColor: '#354960', width: 96 }}>
<TableCell style={{ ...style2, top: 0, zIndex: 99, backgroundColor: '#354960', width: 96 }}>
<Typography style={{ color: 'white', fontSize: 12, fontWeight: 'bold', textAlign: 'center' }}>{columnMeta.name}</Typography>
</TableCell>
),
setCellProps: () => ({ style2 }),
customBodyRender: (value, tableMeta, updateValue) => {
return (
<div style={{ textAlign: 'right' }}>
......@@ -1143,10 +1147,11 @@ export default class BalanceSheet extends Component {
name: "May 2021",
options: {
customHeadRender: (columnMeta) => (
<TableCell style={{ backgroundColor: '#354960', width: 96 }}>
<TableCell style={{ ...style2, top: 0, zIndex: 99, backgroundColor: '#354960', width: 96 }}>
<Typography style={{ color: 'white', fontSize: 12, fontWeight: 'bold', textAlign: 'center' }}>{columnMeta.name}</Typography>
</TableCell>
),
setCellProps: () => ({ style2 }),
customBodyRender: (value, tableMeta, updateValue) => {
return (
<div style={{ textAlign: 'right' }}>
......@@ -1214,10 +1219,11 @@ export default class BalanceSheet extends Component {
name: "June 2021",
options: {
customHeadRender: (columnMeta) => (
<TableCell style={{ backgroundColor: '#354960', width: 96 }}>
<TableCell style={{ ...style2, top: 0, zIndex: 99, backgroundColor: '#354960', width: 96 }}>
<Typography style={{ color: 'white', fontSize: 12, fontWeight: 'bold', textAlign: 'center' }}>{columnMeta.name}</Typography>
</TableCell>
),
setCellProps: () => ({ style2 }),
customBodyRender: (value, tableMeta, updateValue) => {
return (
<div style={{ textAlign: 'right' }}>
......@@ -1285,10 +1291,11 @@ export default class BalanceSheet extends Component {
name: "July 2021",
options: {
customHeadRender: (columnMeta) => (
<TableCell style={{ backgroundColor: '#354960', width: 96 }}>
<TableCell style={{ ...style2, top: 0, zIndex: 99, backgroundColor: '#354960', width: 96 }}>
<Typography style={{ color: 'white', fontSize: 12, fontWeight: 'bold', textAlign: 'center' }}>{columnMeta.name}</Typography>
</TableCell>
),
setCellProps: () => ({ style2 }),
customBodyRender: (value, tableMeta, updateValue) => {
return (
<div style={{ textAlign: 'right' }}>
......@@ -1356,10 +1363,11 @@ export default class BalanceSheet extends Component {
name: "August 2021",
options: {
customHeadRender: (columnMeta) => (
<TableCell style={{ backgroundColor: '#354960', width: 96 }}>
<TableCell style={{ ...style2, top: 0, zIndex: 99, backgroundColor: '#354960', width: 96 }}>
<Typography style={{ color: 'white', fontSize: 12, fontWeight: 'bold', textAlign: 'center' }}>{columnMeta.name}</Typography>
</TableCell>
),
setCellProps: () => ({ style2 }),
customBodyRender: (value, tableMeta, updateValue) => {
return (
<div style={{ textAlign: 'right' }}>
......@@ -1427,10 +1435,11 @@ export default class BalanceSheet extends Component {
name: "September 2021",
options: {
customHeadRender: (columnMeta) => (
<TableCell style={{ backgroundColor: '#354960', width: 96 }}>
<TableCell style={{ ...style2, top: 0, zIndex: 99, backgroundColor: '#354960', width: 96 }}>
<Typography style={{ color: 'white', fontSize: 12, fontWeight: 'bold', textAlign: 'center' }}>{columnMeta.name}</Typography>
</TableCell>
),
setCellProps: () => ({ style2 }),
customBodyRender: (value, tableMeta, updateValue) => {
return (
<div style={{ textAlign: 'right' }}>
......@@ -1498,10 +1507,11 @@ export default class BalanceSheet extends Component {
name: "October 2021",
options: {
customHeadRender: (columnMeta) => (
<TableCell style={{ backgroundColor: '#354960', width: 96 }}>
<TableCell style={{ ...style2, top: 0, zIndex: 99, backgroundColor: '#354960', width: 96 }}>
<Typography style={{ color: 'white', fontSize: 12, fontWeight: 'bold', textAlign: 'center' }}>{columnMeta.name}</Typography>
</TableCell>
),
setCellProps: () => ({ style2 }),
customBodyRender: (value, tableMeta, updateValue) => {
return (
<div style={{ textAlign: 'right' }}>
......@@ -1569,10 +1579,11 @@ export default class BalanceSheet extends Component {
name: "November 2021",
options: {
customHeadRender: (columnMeta) => (
<TableCell style={{ backgroundColor: '#354960', width: 96 }}>
<TableCell style={{ ...style2, top: 0, zIndex: 99, backgroundColor: '#354960', width: 96 }}>
<Typography style={{ color: 'white', fontSize: 12, fontWeight: 'bold', textAlign: 'center' }}>{columnMeta.name}</Typography>
</TableCell>
),
setCellProps: () => ({ style2 }),
customBodyRender: (value, tableMeta, updateValue) => {
return (
<div style={{ textAlign: 'right' }}>
......@@ -1640,10 +1651,11 @@ export default class BalanceSheet extends Component {
name: "December 2021",
options: {
customHeadRender: (columnMeta) => (
<TableCell style={{ backgroundColor: '#354960', width: 96 }}>
<TableCell style={{ ...style2, top: 0, zIndex: 99, backgroundColor: '#354960', width: 96 }}>
<Typography style={{ color: 'white', fontSize: 12, fontWeight: 'bold', textAlign: 'center' }}>{columnMeta.name}</Typography>
</TableCell>
),
setCellProps: () => ({ style2 }),
customBodyRender: (value, tableMeta, updateValue) => {
return (
<div style={{ textAlign: 'right' }}>
......@@ -1711,10 +1723,11 @@ export default class BalanceSheet extends Component {
name: "Current Total",
options: {
customHeadRender: (columnMeta) => (
<TableCell style={{ backgroundColor: '#354960', width: 96 }}>
<TableCell style={{ ...style2, top: 0, zIndex: 99, backgroundColor: '#354960', width: 96 }}>
<Typography style={{ color: 'white', fontSize: 12, fontWeight: 'bold', textAlign: 'center' }}>{columnMeta.name}</Typography>
</TableCell>
),
setCellProps: () => ({ style2 }),
customBodyRender: (value, tableMeta, updateValue) => {
return (
<div style={{ textAlign: 'right' }}>
......@@ -1782,10 +1795,11 @@ export default class BalanceSheet extends Component {
name: "31 Dec 2022 Total",
options: {
customHeadRender: (columnMeta) => (
<TableCell style={{ backgroundColor: '#354960', width: 96 }}>
<TableCell style={{ ...style2, top: 0, zIndex: 99, backgroundColor: '#354960', width: 96 }}>
<Typography style={{ color: 'white', fontSize: 12, fontWeight: 'bold', textAlign: 'center' }}>{columnMeta.name}</Typography>
</TableCell>
),
setCellProps: () => ({ style2 }),
customBodyRender: (value, tableMeta, updateValue) => {
return (
<div style={{ textAlign: 'right' }}>
......@@ -1853,10 +1867,11 @@ export default class BalanceSheet extends Component {
name: "31 Dec 2023 Total",
options: {
customHeadRender: (columnMeta) => (
<TableCell style={{ backgroundColor: '#354960', width: 96 }}>
<TableCell style={{ ...style2, top: 0, zIndex: 99, backgroundColor: '#354960', width: 96 }}>
<Typography style={{ color: 'white', fontSize: 12, fontWeight: 'bold', textAlign: 'center' }}>{columnMeta.name}</Typography>
</TableCell>
),
setCellProps: () => ({ style2 }),
customBodyRender: (value, tableMeta, updateValue) => {
return (
<div style={{ textAlign: 'right' }}>
......@@ -1923,6 +1938,8 @@ export default class BalanceSheet extends Component {
}
]
console.log(this.props.width);
return (
<div style={{ height: this.props.height, backgroundColor: '#f8f8f8', marginBottom: 100, minHeight: 1000 }}>
<div className={"main-color"} style={{ height: 78, flex: 1, display: 'flex', alignItems: 'center', paddingLeft: 20 }}>
......@@ -1940,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: '100%' }}>
<div style={{ marginTop: 20, width: this.props.width - 200, height: this.props.height-200 }}>
<MuiThemeProvider theme={getMuiTheme()}>
<MUIDataTable
data={dataTable2}
......@@ -1963,16 +1980,16 @@ export default class BalanceSheet extends Component {
onClick={() => this.props.onClickClose()}
>
<div style={{ backgroundColor: '#019ce5', width: 105, height: 25, borderRadius: 3, justifyContent: 'center', display: 'flex', alignItems: 'center' }}>
<Typography style={{ fontSize: '11px', color: '#fff', textAlign: 'center' }}>Kembali</Typography>
<Typography style={{ fontSize: '11px', color: '#fff', textAlign: 'center' }}>Back</Typography>
</div>
</button>
</div>
<div className="col-2" style={{ display: 'flex', justifyContent: 'flex-end', maxWidth: '100%' }}>
<div style={{ backgroundColor: '#fff', width: 105, height: 25, borderRadius: 3, justifyContent: 'center', display: 'flex', alignItems: 'center', border: 'solid 1px #354960', marginRight: 20 }}>
<Typography style={{ fontSize: '11px', color: '#354960', textAlign: 'center' }}>Batal</Typography>
<Typography style={{ fontSize: '11px', color: '#354960', textAlign: 'center' }}>Cancel</Typography>
</div>
<div style={{ backgroundColor: '#354960', width: 105, height: 25, borderRadius: 3, justifyContent: 'center', display: 'flex', alignItems: 'center', marginRight: 20 }}>
<Typography style={{ fontSize: '11px', color: '#fff', textAlign: 'center' }}>Simpan</Typography>
<Typography style={{ fontSize: '11px', color: '#fff', textAlign: 'center' }}>Save</Typography>
</div>
<button
className="button"
......
src/container/Home.js
View file @ e8650ce6
......@@ -473,22 +473,25 @@ export default function MiniDrawer() {
</IconButton>}
{open &&
<div style={{ width: '100%', marginTop: 15, marginBottom: 60 }}>
<Typography style={{ fontSize: 14, color: '#fff', textAlign: 'center', fontWeight: 'bold' }}>{userFullname}</Typography>
<Typography style={{ fontSize: 14, color: '#fff', textAlign: 'center', marginTop: 10 }}>{userEmail}</Typography>
<Link to={"profile"}>
<Typography style={{ fontSize: 14, color: '#fff', textAlign: 'center', fontWeight: 'bold' }}>{userFullname}</Typography>
</Link>
<Link to={"profile"}>
<Typography style={{ fontSize: 14, color: '#fff', textAlign: 'center', marginTop: 10 }}>{userEmail}</Typography>
</Link>
</div>
}
</div>
<Divider />
{open &&
<div style={{ width: '100%', textAlign: '-webkit-center', marginTop: -45, display: 'flex', justifyContent: 'center' }}>
<div className={"sub-color"} style={{ width: 90, height: 90, borderRadius: 50, display: 'flex', justifyContent: 'center' }}>
<div style={{ width: 72, height: 72, backgroundColor: '#838383', borderRadius: 50, alignSelf: 'center' }}>
<Link to={"profile"}>
<Link to={"profile"}>
<div className={"sub-color"} style={{ width: 90, height: 90, borderRadius: 50, display: 'flex', justifyContent: 'center' }}>
<div style={{ width: 72, height: 72, backgroundColor: '#838383', borderRadius: 50, alignSelf: 'center' }}>
{userPhoto === "" ? null : <img src={userPhoto} style={{ width: 72, height: 72, borderRadius: 50 }} />}
</Link>
</div>
</div>
</div>
</Link>
</div>
}
{open && application.length > 0 &&
......@@ -619,7 +622,7 @@ export default function MiniDrawer() {
key={index}
path={route.path}
// exact={route.exact}
children={<route.main height={height} />}
children={<route.main height={height} width={width} />}
/>
))}
</Switch>
......
src/library/CustomTable.js
View file @ e8650ce6
......@@ -356,6 +356,7 @@ exports.customOptionsFixedColumn = function () {
filterType: false,
filter: false,
sort: false,
responsive: 'scrollMaxHeight',
viewColumns:false,
overflowX: 'auto',
print: false,
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment