Skip to content

T
Tia-dev
Commit 049e4a89 authored by Dida Adams Arizona's avatar Dida Adams Arizona
Browse files
Options

Merge branch 'didam' into 'master' 

apdet didim

See merge request !94
parents b0c28986 af7e9aed
Hide whitespace changes
Inline Side-by-side
Showing with 139 additions and 22 deletions
package-lock.json
View file @ 049e4a89
......@@ -4341,6 +4341,16 @@
"sha.js": "^2.4.8"
}
},
"create-react-class": {
"version": "15.6.3",
"resolved": "https://registry.npmjs.org/create-react-class/-/create-react-class-15.6.3.tgz",
"integrity": "sha512-M+/3Q6E6DLO6Yx3OwrWjwHBnvfXXYA7W+dFjt/ZDBemHO1DDZhsalX/NUtnTYclN6GfnBDRh4qRHjcDHmlJBJg==",
"requires": {
"fbjs": "^0.8.9",
"loose-envify": "^1.3.1",
"object-assign": "^4.1.1"
}
},
"cross-spawn": {
"version": "6.0.5",
"resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-6.0.5.tgz",
......@@ -14990,6 +15000,24 @@
"prop-types": "^15.6.2"
}
},
"react-addons-shallow-compare": {
"version": "15.6.2",
"resolved": "https://registry.npmjs.org/react-addons-shallow-compare/-/react-addons-shallow-compare-15.6.2.tgz",
"integrity": "sha1-GYoAuR/DdiPbZKKP0XtZa6NicC8=",
"requires": {
"fbjs": "^0.8.4",
"object-assign": "^4.1.0"
}
},
"react-addons-update": {
"version": "15.6.2",
"resolved": "https://registry.npmjs.org/react-addons-update/-/react-addons-update-15.6.2.tgz",
"integrity": "sha1-5TdTxbNIh5dFEMiC1/sHWFHV5QQ=",
"requires": {
"fbjs": "^0.8.9",
"object-assign": "^4.1.0"
}
},
"react-app-polyfill": {
"version": "1.0.6",
"resolved": "https://registry.npmjs.org/react-app-polyfill/-/react-app-polyfill-1.0.6.tgz",
......@@ -15392,6 +15420,44 @@
"@babel/runtime": "^7.1.2"
}
},
"react-nestable": {
"version": "1.3.0",
"resolved": "https://registry.npmjs.org/react-nestable/-/react-nestable-1.3.0.tgz",
"integrity": "sha512-M77eeVlChnxfM/zHQeX3+D+UvKtCG3+TjCphfQ8PHlvkwe14LwN4xtoxsD+y+y3jKqfq126pBI4R1nsoczOFtQ==",
"requires": {
"classnames": "^2.2.5",
"prop-types": "^15.6.0",
"react": "^15.3.2",
"react-addons-shallow-compare": "^15.3.1",
"react-addons-update": "^15.3.2",
"react-dom": "^15.3.2"
},
"dependencies": {
"react": {
"version": "15.6.2",
"resolved": "https://registry.npmjs.org/react/-/react-15.6.2.tgz",
"integrity": "sha1-26BDSrQ5z+gvEI8PURZjkIF5qnI=",
"requires": {
"create-react-class": "^15.6.0",
"fbjs": "^0.8.9",
"loose-envify": "^1.1.0",
"object-assign": "^4.1.0",
"prop-types": "^15.5.10"
}
},
"react-dom": {
"version": "15.6.2",
"resolved": "https://registry.npmjs.org/react-dom/-/react-dom-15.6.2.tgz",
"integrity": "sha1-Qc+t9pO3V/rycIRDodH9WgK+9zA=",
"requires": {
"fbjs": "^0.8.9",
"loose-envify": "^1.1.0",
"object-assign": "^4.1.0",
"prop-types": "^15.5.10"
}
}
}
},
"react-number-format": {
"version": "4.4.1",
"resolved": "https://registry.npmjs.org/react-number-format/-/react-number-format-4.4.1.tgz",
......
package.json
View file @ 049e4a89
......@@ -33,6 +33,7 @@
"react-dropzone": "^11.0.2",
"react-excel-renderer": "^1.1.0",
"react-linechart": "^1.1.12",
"react-nestable": "^1.3.0",
"react-number-format": "^4.4.1",
"react-router-dom": "^5.2.0",
"react-scripts": "3.4.1",
......
src/container/MasterData/formReportItems/VisualReportItems.js
View file @ 049e4a89
import React, { Component } from 'react';
import { makeStyles } from '@material-ui/core/styles';
import { TextField, List, ListSubheader, Typography } from '@material-ui/core';
import { TextField, List, ListSubheader, Typography, Collapse } from '@material-ui/core';
import MinimizeIcon from '@material-ui/icons/Minimize';
import AddIcon from '@material-ui/icons/Add';
import RemoveIcon from '@material-ui/icons/Remove';
import TreeView from '@material-ui/lab/TreeView';
import TreeItem from '@material-ui/lab/TreeItem';
import Nestable from 'react-nestable';
const useStyles = makeStyles((theme) => ({
root: {
......@@ -49,7 +50,30 @@ export default class VisualReportItems extends Component {
constructor(props) {
super(props)
this.state = {
open: false
open: false,
items: [
{ id: 0, text: 'Accumulated Depreciation (negative value)', collapse: false,
children: [
{ id: 3, text: 'Beginning Balance', collapse: false },
{ id: 4, text: 'Depreciation expense MTD (please fill in, if any)', collapse: false },
{ id: 5, text: 'Depreciation expense MTD (please fill in, if any)', collapse: false }
]
},{
id: 1, text: 'Control Gain/(Loss) on Fixed Assets', collapse: false
},{
id: 2, text: 'Gain/(Loss) on Fixed Assets', collapse: false,
children: [
{ id: 6, text: 'NBV', collapse: false,
children : [
{ id: 8, text: 'Cost', collapse: false },
{ id: 9, text: 'Accm. Depreciation', collapse: false },
]
},
{ id: 7, text: 'Proceed from sale or disposal of Fixed Assets (please fill in, if any)', collapse: false },
]
},
],
arrayCollapse: []
}
}
......@@ -57,6 +81,47 @@ export default class VisualReportItems extends Component {
console.log(this.props.height)
}
handleCollapse(item) {
let index = this.state.items.findIndex((val) => val.id === item.id)
let items = this.state.items
if ( index == -1 ){
if (item.children.length > 0) {
this.handleCollapse(item)
}
} else {
items[index].collapse = !items[index].collapse
console.log(items[index])
}
}
renderItem = ({ item, index }) => {
return(item.text)
// if (item.children.length > 0) {
// return (
// <TreeView
// defaultCollapseIcon={<RemoveIcon />}
// defaultExpandIcon={< AddIcon/>}
// >
// {item.children.length > 0 &&
// <TreeItem nodeId={item.id} style={{margin: 10}} label={item.text}>
// {item.children.map((items,indexs) => {
// return (
// <TreeItem nodeId={items.id} style={{margin: 10}} label={items.text}/>
// )
// })}
// </TreeItem>
// // :
// // <TreeItem nodeId={item.id} style={{margin: 10}} label={item.text}/>
// }
// </TreeView>
// )
// } else {
// return (
// <TreeItem nodeId={item.id} style={{margin: 10}} label={item.text}/>
// )
// }
};
render() {
return (
......@@ -143,26 +208,11 @@ export default class VisualReportItems extends Component {
</TextField>
</div>
<div className="margin-top-30px">
<TreeView
defaultCollapseIcon={<RemoveIcon />}
defaultExpandIcon={< AddIcon/>}
>
<TreeItem nodeId="1" style={{margin: 10}} label="Accumulated Depreciation (negative value)">
<TreeItem nodeId="2" style={{margin: 20}} label="Beginning Balance" />
<TreeItem nodeId="3" style={{margin: 20}} label="Depreciation expense MTD (please fill in, if any)" />
<TreeItem nodeId="4" style={{margin: 20}} label="Disposal (positive value) (please fill in, if any)" />
</TreeItem>
<TreeItem nodeId="10" style={{margin: 20}} label="Control Gain/(Loss) on Fixed Assets" />
<TreeItem nodeId="5" style={{margin: 10}} label="Gain/(Loss) on Fixed Assets">
<TreeItem nodeId="6" style={{margin: 20}} label="NBV">
<TreeItem nodeId="7" style={{margin: 20}} label="Cost"/>
<TreeItem nodeId="9" style={{margin: 20}} label="Accm. Depreciation" />
</TreeItem>
<TreeItem nodeId="10" style={{margin: 20}} label="Proceed from sale or disposal of Fixed Assets (please fill in, if any)" />
</TreeItem>
</TreeView>
<Nestable
items={this.state.items}
renderItem={this.renderItem}
onChange={(e) => this.setState({items: e})}
/>
</div>
</div>
</div>
......
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