import React, { useEffect, useState, useMemo } from 'react'; import { connect } from 'react-redux'; import { Select, Input, Button, Tooltip, DatePicker, Table } from '@douyinfe/semi-ui'; import { IconSearch } from '@douyinfe/semi-icons'; import ReactECharts from 'echarts-for-react'; import * as echarts from 'echarts'; import DeleteModal from '../components/deleteModal'; import PersonnelModal from '../components/personnelModal'; import moment from 'moment' import { UserAttribute } from '$utils' import { isAuthorized } from '$utils' import '../style.less' const Rest = (props) => { const { dispatch, actions, user, loading, socket, history } = props const { humanAffairs } = actions; const [option, setOption] = useState({}); const [leaveoption, setLeaveOption] = useState({}); const [tableData, setTableData] = useState([]) //表格数据 const [leaveData, setLeaveData] = useState([]) //表格数据 const [tableStatistic, setTableStatistic] = useState({}) //加班总数据 const [leaveStatistic, setLeaveStatistic] = useState({}) //请假总数据 const [deleteModal, setDeleteModal] = useState(false) //删除弹框 const [personnelModal, setPersonnelModal] = useState(false);//档案弹框 const [columns, setColumns] = useState([//表格属性 { title: "实例号", dataIndex: "storyId", key: 'storyId', render: (text, r, index) => { return {text}; }, }, { title: "事由", dataIndex: "reason", key: 'reason', render: (text, r, index) => { return text; }, }, { title: "类型", dataIndex: "compensate", key: 'compensate', render: (text, r, index) => { return text; }, }, { title: "发起时间", dataIndex: "createTime", key: 'createTime', render: (text, r, index) => { return moment(text).format('YYYY-MM-DD HH:mm'); }, }, { title: "开始时间", dataIndex: "startTime", key: 'startTime', render: (text, r, index) => { return moment(text).format('YYYY-MM-DD HH:mm'); }, }, { title: "结束时间", dataIndex: "endTime", key: 'endTime', render: (text, r, index) => { return moment(text).format('YYYY-MM-DD HH:mm'); }, }, { title: "核定时间", dataIndex: "duration", key: 'duration', render: (text, r, index) => { return (text / 60 / 60 + '小时'); }, }, ]) const [leaveColumns, setLeaveColumns] = useState([//表格属性 { title: "实例号", dataIndex: "storyId", key: 'storyId', render: (text, r, index) => { return {text}; }, }, { title: "事由", dataIndex: "reason", key: 'reason', render: (text, r, index) => { return text; }, }, { title: "类型", dataIndex: "type", key: 'type', render: (text, r, index) => { return text; }, }, { title: "发起时间", dataIndex: "createTime", key: 'createTime', render: (text, r, index) => { return moment(text).format('YYYY-MM-DD HH:mm'); }, }, { title: "开始时间", dataIndex: "startTime", key: 'startTime', render: (text, r, index) => { return moment(text).format('YYYY-MM-DD HH:mm'); }, }, { title: "结束时间", dataIndex: "endTime", key: 'endTime', render: (text, r, index) => { return moment(text).format('YYYY-MM-DD HH:mm'); }, }, { title: "核定时间", dataIndex: "duration", key: 'duration', render: (text, r, index) => { return (text / 60 / 60 + '小时'); }, }, ]) const [pepUserCode, setPepUserCode] = useState(''); const [pepUserId, setPepUserId] = useState(''); const [pepObj, setPepObj] = useState({}); const scroll = useMemo(() => ({ y: 248 }), []); const [startDate, setStartDate] = useState('');//开始时间 const [endDate, setEndDate] = useState('');//结束时间 useEffect(() => { setPepUserCode(history?.location?.search.slice(1).split('-')[0]) setPepUserId(history?.location?.search.slice(1).split('-')[1]) peopleDetail() }, []) useEffect(() => { getWorkOption()//加班信息 getLeaveOption()//请假信息 }, [startDate, endDate]) function peopleDetail() { dispatch(humanAffairs.getMemberList({ keywordTarget: 'number', keyword: history?.location?.search.slice(1).split('-')[0] })).then((res) => {//搜索项企用户 if (res.success) { setPepObj(res.payload?.data?.rows[0]) } }) } function getWorkOption() {//加班折线图 let date = []; let showdate = [] let showdate1 = [] dispatch(humanAffairs.getMemberOvertime({ pepUserId: history?.location?.search.slice(1).split('-')[1], startDate: startDate, endDate: endDate })).then((res) => {//搜索项企用户 if (res.success) { setTableData(res.payload?.data?.data) setTableStatistic(res.payload?.data) let textdate = []; for (let i = 0; i < res.payload?.data?.dayStatisticData?.length; i++) { if (textdate.findIndex((ev) => { return ev.time == moment(res.payload.data.dayStatisticData[i].day).format('YYYY/MM') && ev.compensate == res.payload.data.dayStatisticData[i].compensate }) !== -1) { textdate[textdate.findIndex((ev) => { return ev.time == moment(res.payload.data.dayStatisticData[i].day).format('YYYY/MM') && ev.compensate == res.payload.data.dayStatisticData[i].compensate })].num = textdate[textdate.findIndex((ev) => { return ev.time == moment(res.payload.data.dayStatisticData[i].day).format('YYYY/MM') && ev.compensate == res.payload.data.dayStatisticData[i].compensate })].num + res.payload.data.dayStatisticData[i].duration / 3600 } else { textdate.push({ time: moment(res.payload.data.dayStatisticData[i].day).format('YYYY/MM'), num: res.payload.data.dayStatisticData[i].duration / 3600, compensate: res.payload.data.dayStatisticData[i].compensate }) } } for (let l = 0; l < textdate.length; l++) { if (textdate[l].compensate == '调休') { showdate.push([textdate[l].time, textdate[l].num]) } else { showdate1.push([textdate[l].time, textdate[l].num]) } } if (!startDate && !endDate) { for (let i = 0; i < 12; i++) { date.unshift(moment(new Date()).subtract(i, 'months').format('YYYY/MM')); } } else { let nowdate = moment(startDate).format('YYYY/MM') date.push(nowdate) for (let o = 0; o < 10000; o++) { if (nowdate !== moment(endDate).format('YYYY/MM')) { nowdate = moment(nowdate).add(1, 'months').format('YYYY/MM') date.push(nowdate) } else { break } } } let data = { legend: { data: ["调休", "折算"], left: 'right', icon: 'roundRect', itemHeight: 3, // 粗细 }, color: ['#0F7EFB', '#FE9812'], //两条折线的颜色 xAxis: [ { boundaryGap: false, data: date, }, ], yAxis: [ { type: "value", name: '小时' }, ], dataZoom: [ { id: "dataZoomX", type: "slider", start: 0, end: 100, handleIcon: "M10.7,11.9v-1.3H9.3v1.3c-4.9,0.3-8.8,4.4-8.8,9.4c0,5,3.9,9.1,8.8,9.4v1.3h1.3v-1.3c4.9-0.3,8.8-4.4,8.8-9.4C19.5,16.3,15.6,12.2,10.7,11.9z M13.3,24.4H6.7V23h6.6V24.4z M13.3,19.6H6.7v-1.4h6.6V19.6z", handleSize: "80%", }, ], tooltip: { trigger: 'axis', axisPointer: { type: 'cross', label: { backgroundColor: '#6a7985' } } }, series: [ { name: "调休", type: "line", areaStyle: { color: 'rgba(14,156,255,0.5)', opacity: 0.1 }, smooth: true, data: showdate, }, { name: "折算", type: "line", areaStyle: { color: 'rgba(254,152,18,0.2)', }, smooth: true, data: showdate1, }, ], } setOption(data) } }) } function getLeaveOption() {//请假折线图 let date = []; let showdate = [] dispatch(humanAffairs.getMemberVacate({ pepUserId: history?.location?.search.slice(1).split('-')[1], startDate: startDate, endDate: endDate })).then((res) => {//搜索项企用户 if (res.success) { setLeaveData(res.payload?.data?.data) let year = 0; let compassionate = 0; let sick = 0; let other = 0; let all = 0; for (let i = 0; i < res.payload?.data?.statistic.length; i++) { if (res.payload?.data?.statistic[i].type == '事假') { compassionate = compassionate + (res.payload?.data?.statistic[i].sumDuration / 60 / 60) } else if (res.payload?.data?.statistic[i].type == '病假') { sick = sick + (res.payload?.data?.statistic[i].sumDuration / 60 / 60) } else if (res.payload?.data?.statistic[i].type == '年休假') { year = year + (res.payload?.data?.statistic[i].sumDuration / 60 / 60) } else { other = other + (res.payload?.data?.statistic[i].sumDuration / 60 / 60) } all = all + (res.payload?.data?.statistic[i].sumDuration / 60 / 60) } setLeaveStatistic({ compassionate, sick, year, other, all }) let textdate = []; for (let i = 0; i < res.payload?.data?.dayStatisticData?.length; i++) { if (textdate.findIndex((ev) => { return ev.time == moment(res.payload.data.dayStatisticData[i].day).format('YYYY/MM') }) !== -1) { textdate[textdate.findIndex((ev) => { return ev.time == moment(res.payload.data.dayStatisticData[i].day).format('YYYY/MM') })].num = textdate[textdate.findIndex((ev) => { return ev.time == moment(res.payload.data.dayStatisticData[i].day).format('YYYY/MM') })].num + res.payload.data.dayStatisticData[i].duration / 3600 } else { textdate.push({ time: moment(res.payload.data.dayStatisticData[i].day).format('YYYY/MM'), num: res.payload.data.dayStatisticData[i].duration / 3600 }) } } for (let l = 0; l < textdate.length; l++) { showdate.push([textdate[l].time, textdate[l].num]) } if (!startDate && !endDate) { for (let i = 0; i < 12; i++) { date.unshift(moment(new Date()).subtract(i, 'months').format('YYYY/MM')); } } else { let nowdate = moment(startDate).format('YYYY/MM') date.push(nowdate) for (let o = 0; o < 10000; o++) { if (nowdate !== moment(endDate).format('YYYY/MM')) { nowdate = moment(nowdate).add(1, 'months').format('YYYY/MM') date.push(nowdate) } else { break } } } let data = { legend: { data: ["请假"], left: 'right', icon: 'roundRect', itemHeight: 3, // 粗细 }, color: ['#0F7EFB', '#FE9812'], //两条折线的颜色 xAxis: [ { boundaryGap: false, data: date, }, ], yAxis: [ { type: "value", name: '小时' }, ], dataZoom: [ { id: "dataZoomX", type: "slider", start: 0, end: 100, handleIcon: "M10.7,11.9v-1.3H9.3v1.3c-4.9,0.3-8.8,4.4-8.8,9.4c0,5,3.9,9.1,8.8,9.4v1.3h1.3v-1.3c4.9-0.3,8.8-4.4,8.8-9.4C19.5,16.3,15.6,12.2,10.7,11.9z M13.3,24.4H6.7V23h6.6V24.4z M13.3,19.6H6.7v-1.4h6.6V19.6z", handleSize: "80%", }, ], tooltip: { trigger: 'axis', axisPointer: { type: 'cross', label: { backgroundColor: '#6a7985' } } }, series: [ { name: "请假", type: "line", areaStyle: { color: 'rgba(14,156,255,0.5)', opacity: 0.1 }, smooth: true, data: showdate, }, ], } setLeaveOption(data) } }) } function handleChange(date) { if (date.length > 1) { setStartDate(moment(date[0]).format('YYYY-MM-DD')) setEndDate(moment(date[1]).format('YYYY-MM-DD')) } else { setStartDate('') setEndDate('') } } return ( <>
人事管理
/
档案中心
/
人员档案
/
档案详情
{ history.goBack(); }}>
{pepObj?.userName}的个人档案
{ isAuthorized('EDITPROFILE') ?
{ setPersonnelModal(true); }} > 编辑档案
: '' } { isAuthorized('DELETEFILES') ?
{ setDeleteModal(true) }} > 删除档案
: '' }
{/* 基本信息 */}
基本信息
证件号:
{pepObj.idNumber || '暂无'}
联系方式:
{pepObj.phoneNumber || '暂无'}
姓名:
{pepObj.userName || '暂无'}
性别:
{pepObj.gender || '暂无'}
出生日期:
{pepObj.birthday || '暂无'}
政治面貌:
{pepObj.politicsStatus || '暂无'}
年龄:
{pepObj.birthday ? moment(new Date()).diff(pepObj.birthday, 'years') + '岁' : '暂无'}
籍贯:
{pepObj.nativePlace || '暂无'}
婚育状态:
{pepObj.marital || '暂无'}
工作地点:
{pepObj.workPlace || '暂无'}
{/* 学历信息 */}
学历信息
毕业院校:
{pepObj.graduatedFrom || '暂无'}
毕业时间:
{pepObj.graduationDate || '暂无'}
学历:
{pepObj.educationBackground || '暂无'}
专业:
{pepObj.specialty || '暂无'}
{/* 职务信息 */}
职务信息
员工编号:
{pepObj.userCode || '暂无'}
入职时间:
{pepObj.hiredate || '暂无'}
转试用期时间:
{pepObj.turnProbationPeriod || '暂无'}
转正时间:
{pepObj.regularDate || '暂无'}
员工职位:
{ pepObj.userJob ? UserAttribute.jobDataSource[pepObj.userJob - 1] : '暂无' }
员工岗位:
{ pepObj.userPost || '暂无' }
所属机构:
{ pepObj.userOrganization ? UserAttribute.organizationDataSource[pepObj.userOrganization - 1] : '暂无' }
所属部门:
{ pepObj.departmrnt?.map((ite, idx) => { let departmentsArr = [] for (let i = 0; i < pepObj.departmrnt.length; i++) { departmentsArr.push(pepObj.departmrnt[i].name) } return (
{idx < 3 ? (
{ite.name}
) : ('') } { pepObj.departmrnt.length > 3 && idx == 3 ? (
+{pepObj.departmrnt.length - 3}
) : ('') }
) }) }
工作经验:
{pepObj.experienceYear ? pepObj.experienceYear + '年' : '暂无'}
入职年限:
{pepObj.hiredate ? String(moment(new Date()).diff(pepObj.hiredate, 'years', true)).substring(0, 3) + '年' : '暂无'}
试用期:
{pepObj.regularDate ? moment(pepObj.regularDate).diff(pepObj.hiredate, 'months', true).toFixed(1) + '个月' : '暂无'}
{ pepObj.vitae ? (
他/她的简历
) : '' }
他/她的历史工作经历与职务
{pepObj.occupationalHistory || '暂无'}
基本动作
时间筛选:
加班信息
加班次数:
{tableData.length}次
工作日:
{tableStatistic.sumPayWorkday / 3600 + tableStatistic.sumTakeRestWorkday / 3600 || 0}小时
普通假日:
{tableStatistic.sumTakeRestDayoff / 3600 + tableStatistic.sumPayDayoff / 3600 || 0}小时
法定假日:
{tableStatistic.sumPayFestivals / 3600 + tableStatistic.sumTakeRestFestivals / 3600 || 0}小时
累计加班时长:
{(tableStatistic.sumPayWorkday / 3600 + tableStatistic.sumTakeRestWorkday / 3600 + tableStatistic.sumTakeRestDayoff / 3600 + tableStatistic.sumPayDayoff / 3600 + tableStatistic.sumPayFestivals / 3600 + tableStatistic.sumTakeRestFestivals / 3600) || 0}小时
请假信息
请假次数:
{leaveData.length}次
年休假:
{leaveStatistic.year}小时
事假:
{leaveStatistic.compassionate}小时
病假:
{leaveStatistic.sick}小时
其他类型请假:
{leaveStatistic.other}小时
合计请假时长:
{leaveStatistic.all}小时
{//新增档案弹框 personnelModal ? { setPersonnelModal(false); }} close={() => { setPersonnelModal(false); peopleDetail() }} > : '' } {//删除弹框 deleteModal ? { setDeleteModal(false); }} close={() => { setDeleteModal(false); history.goBack() }} > : '' } ) } function mapStateToProps(state) { const { auth, global, members, webSocket } = state; return { // loading: members.isRequesting, // user: auth.user, actions: global.actions, // members: members.data, // socket: webSocket.socket }; } export default connect(mapStateToProps)(Rest);