update didam

src/container/Otorisasi/User.js

@@ -8,6 +8,7 @@ import AddRole from './UserRole/AddRole';
 import EditRole from './UserRole/EditRole'
 import api from "../../api";
 import { titleCase } from "../../library/Utils";
+import { InputAdornment, TextField } from "@material-ui/core";
 
 var ct = require("../../library/CustomTable");
 const getMuiTheme = () => createMuiTheme(ct.customTable());
@@ -148,16 +149,42 @@ export default class UserRole extends Component {
         <div style={{ height: 199, backgroundColor: '#354960', width: '100%' }} />
         <div>
           <div style={{ display: 'flex', flexDirection: 'row', justifyContent: 'space-between', paddingRight: 25, paddingLeft: 25, marginTop: -150 }}>
-            <label style={{ color: 'white', width: '20%', alignSelf: 'center'}}>Master Data - Role & Otorisasi</label>
+            <label style={{ fontFamily: 'nunito', color: 'white', width: '20%', alignSelf: 'center', fontSize: 18}}>Master Data - User</label>
             <div style={{width: '60%', justifyContent: 'center', display: 'flex', borderWidth: 2, alignItems: 'center' }}>
-              <div style={{width: '50%', backgroundColor:'white', padding: 10, borderRadius: 7.5, flexDirection: 'row', display: 'flex'}}>
-                <SearchIcon/>
-                <input type="text" placeholder={'Search Role'} style={{flexGrow: 1, marginLeft: 10}}/>
+            <div style={{width: '50%', backgroundColor:'white', padding: 10, borderRadius: 7.5}}>
+                <TextField
+                  id="input-with-icon-textfield"
+                  name="search" 
+                  value={this.state.search}
+                  placeholder={'Search'}
+                  onChange={(e) => {
+                    this.setState({ search: e.target.value }, () => {
+                      if (this.state.search.length > 0) {
+                        this.searchRole()
+                      } else {
+                        this.getRole()
+                      }
+                    });
+                  }}
+                  onKeyDown={(e) => this._handleKeyDown(e)}
+                  style={{width: '100%', borderBottomWidth: 0, borderBottomColor: 'red'}}
+                  InputProps={{
+                    style: { fontFamily: 'nunito', borderBottomColor: 'white'},
+                    startAdornment: (
+                      <InputAdornment position="start">
+                        <SearchIcon />
+                      </InputAdornment>
+                    ),
+                  }}
+                />
               </div>
             </div>
             {/* <label style={{ color: 'white', width: '60%', justifyContent: 'center', display: 'flex', backgroundColor: 'white', borderWidth: 2, alignItems: 'center' }}>Search</label> */}
             <div style={{ width: '20%', justifyContent: 'flex-end', display: 'flex' }}>
-              <img src={Images.add} onClick={() => this.setState({add: true})}/>
+              <img src={Images.template}/>
+              <img src={Images.upload} style={{marginLeft: 20}}/>
+              <img src={Images.download} style={{marginLeft: 20}}/>
+              <img src={Images.add} onClick={() => this.setState({add: true})} style={{marginLeft: 20}}/>
             </div>
           </div>
           <div style={{ padding: 25 }}>

src/container/Otorisasi/UserRole.js

@@ -184,19 +184,12 @@ class UserRole extends Component {
             <label style={{ fontFamily: 'nunito', color: 'white', width: '20%', alignSelf: 'center', fontSize: 18}}>Master Data - Role & Otorisasi</label>
             <div style={{width: '60%', justifyContent: 'center', display: 'flex', borderWidth: 2, alignItems: 'center' }}>
               <div style={{width: '50%', backgroundColor:'white', padding: 10, borderRadius: 7.5}}>
-                {/* <SearchIcon/> */}
                 <TextField
-                  // className={classes.margin}
                   id="input-with-icon-textfield"
-                  // label="TextField"
                   name="search" 
                   value={this.state.search}
-                  placeholder={'Search Role'}
+                  placeholder={'Search'}
                   onChange={(e) => {
-                    // let { search } = this.state;
-                    // search = [...search];
-                    // search.push(e.target.value);
-                    // search[0] = search;
                     this.setState({ search: e.target.value }, () => {
                       if (this.state.search.length > 0) {
                         this.searchRole()

src/container/Otorisasi/UserRole/AddRole.js

@@ -235,6 +235,7 @@ export default class AddRole extends Component {
                                 format="dd MMMM yyyy"
                                 value={this.state.endDate}
                                 onChange={(e) => this.handleChange(e, 'end_date')}
+                                minDate={this.state.startDate}
                                 KeyboardButtonProps={{
                                     'aria-label': 'change date',
                                 }}

src/container/Otorisasi/UserRole/EditRole.js

@@ -247,6 +247,7 @@ export default class EditRole extends Component {
                                     label="Berlaku Hingga"
                                     format="dd MMMM yyyy"
                                     value={this.state.tempData == null ? null : this.state.tempData.end_date}
+                                    minDate={this.state.tempData == null ? null : this.state.tempData.start_date}
                                     onChange={(e) => this.handleChange(e, 'end_date')}
                                     KeyboardButtonProps={{
                                         'aria-label': 'change date',