Commit dfcf1458 authored by Rifka Kurnia Irfiana's avatar Rifka Kurnia Irfiana

update layout appmatrix dan visualnya

parent 847c6434
......@@ -275,7 +275,7 @@ export default class ApprovalMatrix extends Component {
<div>
{this.state.visibleAM === true ?
<div style={{ height: this.props.height }}>
<div style={{ height: 199, width: '100%', backgroundColor: '#354960' }} />
<div class="main-color" style={{ height: 199, width: '100%'}} />
<div>
<div style={{ display: 'flex', flexDirection: 'row', justifyContent: 'space-between', paddingRight: 25, paddingLeft: 25, marginTop: -150 }}>
<label style={{ width: '20%', color: 'white', fontSize: 16, alignSelf: 'center', paddingTop: 8 }}>Master Data - Approval Matrix</label>
......@@ -376,7 +376,7 @@ export default class ApprovalMatrix extends Component {
/>
:
<div style={{ height: this.props.height }}>
<div style={{ height: 199, width: '100%', backgroundColor: '#354960' }} />
<div class="main-color" style={{ height: 199, width: '100%' }} />
<div>
<div>
<div style={{ display: 'flex', flexDirection: 'row', justifyContent: 'space-between', paddingRight: 25, paddingLeft: 25, marginTop: -150 }}>
......
......@@ -6,6 +6,7 @@ import MenuItem from '@material-ui/core/MenuItem';
import ReactDragListView from 'react-drag-listview';
import Autocomplete from '@material-ui/lab/Autocomplete';
import api from "../../api";
import { none } from 'ramda';
const type = [
......@@ -145,10 +146,15 @@ export default class VisualisasiAM extends Component {
return (
<div>
<div style={{ height: this.props.height }}>
<div style={{ height: 199, width: '100%', backgroundColor: '#354960' }} />
<div class="main-color" style={{ height: 199, width: '100%' }} />
<div>
<div style={{ display: 'flex', flexDirection: 'row', justifyContent: 'space-between', paddingRight: 25, paddingLeft: 25, marginTop: -150 }}>
<label style={{ color: 'white', width: '20%', fontSize: 16, paddingTop: 8 }}>Visualisasi Data</label>
<div style={{ display: 'flex', paddingRight: 25, paddingLeft: 25, marginTop: -150 }}>
<label style={{ color: 'white', width: '20%', fontSize: 16, paddingTop: 8 }}>Visualisasi</label>
</div>
<div style={{ display: 'flex', paddingRight: 25, paddingLeft: 25 }}>
<label style={{ color: '#51c6ea', width: '20%', fontSize: 11 }}>Master Data / Approval Matrix /
<span style={{ color: 'white', width: '20%', fontSize: 11 }}> Visualisasi</span>
</label>
</div>
<div style={{ padding: 25, width: '100%' }}>
<div style={{ width: '100%', padding: 25, backgroundColor: 'white', borderRadius: 6, border: 'solid 1px #c4c4c4'}}>
......@@ -160,16 +166,16 @@ export default class VisualisasiAM extends Component {
onChange={(event, newInputValue) => this.setState({typeName:newInputValue.approval_type_name}, () => {
this.handleInputChange()
})}
debug
renderInput={(params) => <TextField {...params} label="Tipe" margin="normal" />}
disableClearable
renderInput={(params) => <TextField {...params} label="Tipe Persetujuan" margin="normal" />}
/>
</div>
<ReactDragListView {...dragProps}>
<ol style={{paddingLeft: 15}}>
{this.state.listApproval.map((item, index) => (
<li key={index} style={{color: '#525252', fontSize: 14}}>
<a href="#" style={{color: '#525252'}}>
<div className="grid grid-3x grid-mobile-none gap-20px" style={{width: '75%'}}>
<li key={index} style={{color: '#4b4b4b', fontSize: 14}}>
<a href='#' style={{ color: '#4b4b4b', fontSize: '14px', cursor: 'auto', outline: 'none' }}>
<div className="grid grid-3x grid-mobile-none gap-20px margin-bottom-20px" style={{width: '75%'}}>
{item.data.map((items, indexs) => {return(<label>{items.fullname}</label>)})}
<label>{item.data.length == 1? '' : item.data[0].operator_type_name}</label>
</div>
......@@ -178,64 +184,6 @@ export default class VisualisasiAM extends Component {
))}
</ol>
</ReactDragListView>
{/* <div className="grid grid-4x grid-mobile-none gap-15px">
<div className="column-1">
<div className="margin-bottom-20px">
<label style={{ color: '#4b4b4b', fontSize: '14px' }}>1. John Doe</label>
</div>
</div>
<div className="column-2">
</div>
<div className="column-3">
</div>
<div className="column-4">
</div>
</div> */}
<div className="grid grid-4x grid-mobile-none gap-15px">
<div className="column-1">
<div className="margin-bottom-20px">
<label style={{ color: '#4b4b4b', fontSize: '14px' }}>2. Barbara Rosa</label>
</div>
</div>
<div className="column-2">
<div className="margin-bottom-20px">
<label style={{ color: '#4b4b4b', fontSize: '14px' }}>Aneesa Hassan</label>
</div>
</div>
<div className="column-3">
<div className="margin-bottom-20px">
<label style={{ color: '#4b4b4b', fontSize: '14px' }}>AND</label>
</div>
</div>
</div>
<div className="grid grid-4x grid-mobile-none gap-15px">
<div className="column-1">
<div className="margin-bottom-20px">
<label style={{ color: '#4b4b4b', fontSize: '14px' }}>3. Cole Park</label>
</div>
</div>
<div className="column-2">
<div className="margin-bottom-20px">
<label style={{ color: '#4b4b4b', fontSize: '14px' }}>Levison Robin</label>
</div>
</div>
<div className="column-3">
<div className="margin-bottom-20px">
<label style={{ color: '#4b4b4b', fontSize: '14px' }}>OR</label>
</div>
</div>
</div>
<div className="grid grid-4x grid-mobile-none gap-15px">
<div className="column-1">
<div className="margin-bottom-20px">
<label style={{ color: '#4b4b4b', fontSize: '14px' }}>4. Madison Price</label>
</div>
</div>
<div className="column-2">
</div>
<div className="column-3">
</div>
</div>
</div>
</div>
<div className="row" style={{ display: 'flex', flexDirection: 'row', justifyContent: 'space-between', paddingRight: 15, paddingLeft: 15, paddingBottom: 25 }}>
......
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