@ -11,6 +11,7 @@ import { DatePicker,Select } from 'antd';
import * as XLSX from 'xlsx' ; import * as XLSX from 'xlsx' ;
import { ABSENSI _SEARCH , ABSENSI _ADD , ABSENSI _DELETE , ABSENSI _EDIT , PROYEK _SEARCH , USERPROYEK _SEARCH } from '../../../const/ApiConst.js' ; import { ABSENSI _SEARCH , ABSENSI _ADD , ABSENSI _DELETE , ABSENSI _EDIT , PROYEK _SEARCH , USERPROYEK _SEARCH } from '../../../const/ApiConst.js' ;
import MapConfig from '../../MapConfig/MapConfig' ; import MapConfig from '../../MapConfig/MapConfig' ;
import { withTranslation } from 'react-i18next' ;
const { RangePicker } = DatePicker ; const { RangePicker } = DatePicker ;
const { Option } = Select const { Option } = Select
const token = window . localStorage . getItem ( 'token' ) ; const token = window . localStorage . getItem ( 'token' ) ;
@ -24,17 +25,9 @@ const config = {
const BASE _URL = "" ; const BASE _URL = "" ;
const column = [
{ name : "Nama Human Resource" } ,
{ name : "Deskripsi" } ,
{ name : "Tanggal Absensi" } ,
]
const LENGTH _DATA = 10 const LENGTH _DATA = 10
export default class index extends Component { class index extends Component {
constructor ( props ) { constructor ( props ) {
super ( props ) super ( props )
this . state = { this . state = {
@ -438,6 +431,7 @@ export default class index extends Component {
} }
renderTable = ( ) => { renderTable = ( ) => {
const t = this . props ;
const dataTable2 = this . state . dataTable || [ ] ; const dataTable2 = this . state . dataTable || [ ] ;
return ( return (
< tbody > < tbody >
@ -461,7 +455,7 @@ export default class index extends Component {
< / t r > < / t r >
) )
} ) : < tr > } ) : < tr >
< td colSpan = "4" align = "center" > No Data Available < / t d > < td colSpan = "4" align = "center" > { this . props . t ( 'noData' ) } < / t d >
< / t r > < / t r >
} }
< / t b o d y > < / t b o d y >
@ -472,21 +466,18 @@ export default class index extends Component {
const val = e . target . value ; const val = e . target . value ;
this . setState ( { currentDay : val } ) ; this . setState ( { currentDay : val } ) ;
if ( val === "today" ) { if ( val === "today" ) {
console . log ( "test 1 test" , val ) ;
this . setState ( { this . setState ( {
startDate : moment ( moment ( ) . format ( "YYYY-M-D" ) ) , startDate : moment ( moment ( ) . format ( "YYYY-M-D" ) ) ,
endDate : moment ( moment ( ) . format ( "YYYY-M-D" ) ) , endDate : moment ( moment ( ) . format ( "YYYY-M-D" ) ) ,
currentPage : 1 currentPage : 1
} ) } )
} else if ( val === "3 day" ) { } else if ( val === "3 day" ) {
console . log ( "test test" , val ) ;
this . setState ( { this . setState ( {
startDate : moment ( moment ( ) . subtract ( 3 , "days" ) . format ( "YYYY-M-D" ) ) , startDate : moment ( moment ( ) . subtract ( 3 , "days" ) . format ( "YYYY-M-D" ) ) ,
endDate : moment ( moment ( ) . format ( "YYYY-M-D" ) ) , endDate : moment ( moment ( ) . format ( "YYYY-M-D" ) ) ,
currentPage : 1 currentPage : 1
} ) } )
} else if ( val === "7 day" ) { } else if ( val === "7 day" ) {
console . log ( "test test" , val ) ;
this . setState ( { this . setState ( {
startDate : moment ( moment ( ) . subtract ( 7 , "days" ) . format ( "YYYY-M-D" ) ) , startDate : moment ( moment ( ) . subtract ( 7 , "days" ) . format ( "YYYY-M-D" ) ) ,
endDate : moment ( moment ( ) . format ( "YYYY-M-D" ) ) , endDate : moment ( moment ( ) . format ( "YYYY-M-D" ) ) ,
@ -503,6 +494,12 @@ export default class index extends Component {
} }
render ( ) { render ( ) {
const t = this . props ;
const column = [
{ name : this . props . t ( 'nameHR' ) } ,
{ name : this . props . t ( 'description' ) } ,
{ name : this . props . t ( 'dateAbsent' ) } ,
]
const { tooltipTambah , tooltipExport , dataTable , openDialog , currentPage , rowsPerPage , totalPage , search , tooltipEdit , tooltipDelete } = this . state const { tooltipTambah , tooltipExport , dataTable , openDialog , currentPage , rowsPerPage , totalPage , search , tooltipEdit , tooltipDelete } = this . state
return ( return (
< div > < div >
@ -513,12 +510,12 @@ export default class index extends Component {
showCancel showCancel
confirmBtnText = "Delete" confirmBtnText = "Delete"
confirmBtnBsStyle = "danger" confirmBtnBsStyle = "danger"
title = "Are you sure?" title = { this . props . t ( 'deleteConfirm' ) }
onConfirm = { this . onConfirmDelete } onConfirm = { this . onConfirmDelete }
onCancel = { ( ) => this . setState ( { alertDelete : false , idDelete : 0 } ) } onCancel = { ( ) => this . setState ( { alertDelete : false , idDelete : 0 } ) }
focusCancelBtn focusCancelBtn
> >
Data Absensi karyawan akan terhapus ! ! { this . props . t ( 'deleteMsg' ) }
< / S w e e t A l e r t > < / S w e e t A l e r t >
< DialogForm < DialogForm
openDialog = { openDialog } openDialog = { openDialog }
@ -533,14 +530,9 @@ export default class index extends Component {
< CardHeader style = { { display : "flex" , justifyContent : "space-between" } } > < CardHeader style = { { display : "flex" , justifyContent : "space-between" } } >
< h4 > { this . props . params . name } < / h 4 > < h4 > { this . props . params . name } < / h 4 >
< div > < div >
{ /* <Button id="TooltipTambah" color="success" onClick={() => this.handleOpenDialog('Save')}><i className="fa fa-plus"></i></Button> */ } < Tooltip title = { this . props . t ( 'exportExcel' ) } >
< Tooltip title = "Export Excel" >
< Button style = { { marginLeft : "5px" } } id = "TooltipExport" color = "primary" onClick = { ( ) => this . handleExportExcel ( ) } > < i className = "fa fa-print" > < / i > < / B u t t o n > < Button style = { { marginLeft : "5px" } } id = "TooltipExport" color = "primary" onClick = { ( ) => this . handleExportExcel ( ) } > < i className = "fa fa-print" > < / i > < / B u t t o n >
< / T o o l t i p > < / T o o l t i p >
{ /* <Button color="primary" onClick={() => this.handleOpenDialog('Save')}>Tambah Divisi Karyawan</Button> */ }
{ / * < T o o l t i p p l a c e m e n t = " r i g h t " i s O p e n = { t o o l t i p T a m b a h } t a r g e t = " T o o l t i p T a m b a h " t o g g l e = { ( ) = > t h i s . t o g g l e ( " t a m b a h " ) } >
Tambah Absensi
< /Tooltip> */ }
< / d i v > < / d i v >
< / C a r d H e a d e r > < / C a r d H e a d e r >
< CardBody > < CardBody >
@ -548,17 +540,17 @@ export default class index extends Component {
< div style = { { width : "100%" , display : "flex" , alignItems : "center" } } > < div style = { { width : "100%" , display : "flex" , alignItems : "center" } } >
< div style = { { width : "100%" , marginRight : "10px" , maxWidth : "200px" } } > < div style = { { width : "100%" , marginRight : "10px" , maxWidth : "200px" } } >
< Input type = "select" onChange = { ( e ) => this . handleChangeDay ( e ) } defaultValue = { this . state . currentDay } > < Input type = "select" onChange = { ( e ) => this . handleChangeDay ( e ) } defaultValue = { this . state . currentDay } >
< option value = "today" > Hari Ini < / o p t i o n > < option value = "today" > { this . props . t ( 'today' ) } < / o p t i o n >
< option value = "3 day" > 3 Hari yang lalu < / o p t i o n > < option value = "3 day" > { this . props . t ( '3days' ) } < / o p t i o n >
< option value = "7 day" > 7 Hari yang lalu < / o p t i o n > < option value = "7 day" > { this . props . t ( '7days' ) } < / o p t i o n >
< / I n p u t > < / I n p u t >
< / d i v > < / d i v >
< div style = { { width : "50%" , marginTop : "3px" } } > < div style = { { width : "50%" , marginTop : "3px" } } >
< RangePicker size = "default" allowClear = { false } value = { [ this . state . startDate , this . state . endDate ] } onChange = { this . handleDatePicker } / > { ' ' } < RangePicker size = "default" allowClear = { false } value = { [ this . state . startDate , this . state . endDate ] } onChange = { this . handleDatePicker } / > { ' ' }
< Button color = "primary" onClick = { ( ) => this . getDataAbsensi ( ) } > Cari < / B u t t o n > < Button color = "primary" onClick = { ( ) => this . getDataAbsensi ( ) } > { this . props . t ( 'search' ) } < / B u t t o n >
< / d i v > < / d i v >
< / d i v > < / d i v >
< Input onChange = { this . handleSearch } value = { search } type = "text" name = "search" id = "search" placeholder = "Cari nama human resource" style = { { maxWidth : "200px" , marginBottom : "20px" } } / > < Input onChange = { this . handleSearch } value = { search } type = "text" name = "search" id = "search" placeholder = { this . props . t ( 'searchHR' ) } style = { { maxWidth : "200px" , marginBottom : "20px" } } / >
< / d i v > < / d i v >
< Table responsive striped hover > < Table responsive striped hover >
< thead > < thead >
@ -588,3 +580,4 @@ export default class index extends Component {
) )
} }
} }
export default withTranslation ( ) ( index ) ;
