import { HrmsEmployeeDetailsDto } from '@gtpl/shared-models/masters';
import { Button, Card, Descriptions, Layout, Input } from 'antd';
import { SearchOutlined } from '@ant-design/icons'
import Highlighter from 'react-highlight-words';
import React, { useEffect, useRef, useState } from 'react';
export interface EmployeeDetailViewProps {
employeeDetails: HrmsEmployeeDetailsDto;
}
export function EmployeeDetailView(
props: EmployeeDetailViewProps
) {
useEffect(() => {
console.log(props.employeeDetails);
}, [props.employeeDetails]);
const [searchText, setSearchText] = useState('');
const [searchedColumn, setSearchedColumn] = useState('');
const searchInput = useRef(null);
const getColumnSearchProps = dataIndex => ({
filterDropdown: ({ setSelectedKeys, selectedKeys, confirm, clearFilters }) => (
setSelectedKeys(e.target.value ? [e.target.value] : [])}
onPressEnter={() => handleSearch(selectedKeys, confirm, dataIndex)}
style={{ width: 188, marginBottom: 8, display: 'block' }}
/>
),
filterIcon: filtered => (
),
onFilter: (value, record) =>
record[dataIndex]
? record[dataIndex]
.toString()
.toLowerCase()
.includes(value.toLowerCase())
: false,
onFilterDropdownVisibleChange: visible => {
console.log(searchInput.current);
if (visible) { setTimeout(() => searchInput.current.select()); }
},
render: text =>
text ? (
searchedColumn === dataIndex ? (
) : text
)
: null
});
function handleSearch(selectedKeys, confirm, dataIndex) {
confirm();
setSearchText(selectedKeys[0]);
setSearchedColumn(dataIndex);
};
function handleReset(clearFilters) {
clearFilters();
setSearchText('');
};
return (
<>
Employee Detail View}
style={{ textAlign: 'center' }} headStyle={{ backgroundColor: '#69c0ff' }}
// extra={<>
// {/* */}
// }
>
{props.employeeDetails ? <>
{props.employeeDetails.employeeType}
{props.employeeDetails.employeeCode}
{props.employeeDetails.employeeName}
{props.employeeDetails.employeeLastName}
{props.employeeDetails.mobileNumber}
{props.employeeDetails.dateOfBirth}
{props.employeeDetails.gender}
{props.employeeDetails.designation}
{props.employeeDetails.maritualStatus}
{props.employeeDetails.emailID}
{props.employeeDetails.bloodGroup}
{props.employeeDetails.nationality}
{props.employeeDetails.departmentId}
{props.employeeDetails.unitId}
{'-'}
{props.employeeDetails.transportation}
{props.employeeDetails.reportingManager}
{props.employeeDetails.emergencyContactNo}
{props.employeeDetails.currentAddress}
{props.employeeDetails.state}
{props.employeeDetails.pinCode}
{props.employeeDetails.permanentAddress}
{props.employeeDetails.permanentState}
{props.employeeDetails.permanentPinCode}
{props.employeeDetails.employeeType}
{props.employeeDetails.companyEmail}
{props.employeeDetails.employeeMode}
{props.employeeDetails.uanNumber}
{props.employeeDetails.panNumber}
{props.employeeDetails.esiNumber}
{props.employeeDetails.isAuditCompleted}
{props.employeeDetails.wageType}
{props.employeeDetails.bankAccountNumber}
{props.employeeDetails.bankName}
{props.employeeDetails.ifscCode}
{props.employeeDetails.skillSet}
{props.employeeDetails.accommodation}
{/*
{props.employeeDetails?.familyDetails[0]?.familyMemName}
{props.employeeDetails?.familyDetails[0]?.relation}
{props.employeeDetails?.familyDetails[0]?.famDateOfBirth}
{props.employeeDetails?.familyDetails[0]?.famAadhaarNo}
{props.employeeDetails?.familyDetails[0]?.contactNo}
{props.employeeDetails?.educationDetails[0]?.empQualification}
{props.employeeDetails?.educationDetails[0]?.specialization}
{props.employeeDetails?.educationDetails[0]?.dateOfPassOut}
{props.employeeDetails?.educationDetails[0]?.percentage}
{props.employeeDetails?.idProofDetails[0]?.idType}
{props.employeeDetails?.idProofDetails[0]?.idNumber}
{props.employeeDetails?.experienceDetails[0]?.organisation}
{props.employeeDetails?.experienceDetails[0]?.designation}
{props.employeeDetails?.experienceDetails[0]?.fromDate}
{props.employeeDetails?.experienceDetails[0]?.toDate}
{props.employeeDetails?.experienceDetails[0]?.experience}
*/}
: ''}
)
}
export default EmployeeDetailView;