71 lines
2.2 KiB
JavaScript
71 lines
2.2 KiB
JavaScript
import React from 'react';
|
|
|
|
|
|
class AssetManagement extends React.Component {
|
|
constructor() {
|
|
super();
|
|
|
|
this.state = {
|
|
newAssetName: 'Name',
|
|
newAssetSE: 'SE',
|
|
newAssetWarranty: 12,
|
|
};
|
|
}
|
|
|
|
onNewAssetNameChange = target => {
|
|
this.setState({
|
|
newAssetName: target.value,
|
|
});
|
|
};
|
|
|
|
onNewAssetSEChange = target => {
|
|
this.setState({
|
|
newAssetSE: target.value,
|
|
});
|
|
};
|
|
|
|
onNewAssetWarrantyChange = target => {
|
|
this.setState({
|
|
newAssetWarranty: target.value,
|
|
});
|
|
};
|
|
|
|
onCreateNewAssetClicked = () => {
|
|
this.props.onCreateAsset({
|
|
name: this.state.newAssetName,
|
|
serial: this.state.newAssetSE,
|
|
warranty_months: this.state.newAssetWarranty,
|
|
});
|
|
}
|
|
|
|
|
|
render() {
|
|
const userAssets = [];
|
|
if (this.props.assets) {
|
|
this.props.assets.forEach(asset => {
|
|
userAssets.push(<div className="asset" key={asset.id}>
|
|
<span>#{asset.asset_tag}</span>
|
|
<span>{asset.name}</span>
|
|
<span>{asset.supplier ? asset.supplier.name : ''}</span>
|
|
<span>Expires: {asset.warranty_expires ? asset.warranty_expires.formatted : '-'}</span>
|
|
<div className="asset-delete" onClick={() => { this.props.onDeleteAsset(asset.id)}}>DELETE</div>
|
|
</div>);
|
|
});
|
|
}
|
|
|
|
return (<div className="asset-management">
|
|
<div className="new-asset">
|
|
<input className="new-asset-input" onChange={this.onNewAssetNameChange} value={this.state.newAssetName}/>
|
|
<input className="new-asset-input" onChange={this.onNewAssetSEChange} value={this.state.newAssetSE}/>
|
|
<input className="new-asset-input" type="number" onChange={this.onNewAssetWarrantyChange} value={this.state.newAssetWarranty}/>
|
|
<button onClick={this.onCreateNewAssetClicked}>Create new</button>
|
|
</div>
|
|
<div className="assets">
|
|
{userAssets}
|
|
</div>
|
|
</div>);
|
|
}
|
|
}
|
|
|
|
export default AssetManagement;
|