|
|
@ -17,112 +17,114 @@ const Rest = (props) => { |
|
|
|
const { humanAffairs } = actions; |
|
|
|
const [option, setOption] = useState({}); |
|
|
|
const [leaveoption, setLeaveOption] = useState({}); |
|
|
|
const [tableData, setTableData] = useState([{}, {}, {}, {}, {}, {}, {}]) //表格数据 |
|
|
|
const [leaveData, setLeaveData] = 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: "index", |
|
|
|
key: 'index', |
|
|
|
dataIndex: "storyId", |
|
|
|
key: 'storyId', |
|
|
|
render: (text, r, index) => { |
|
|
|
return index + 1; |
|
|
|
return <span style={{ color: '#1890FF' }}>{text}</span>; |
|
|
|
}, |
|
|
|
}, { |
|
|
|
title: "事由", |
|
|
|
dataIndex: "why", |
|
|
|
key: 'why', |
|
|
|
dataIndex: "reason", |
|
|
|
key: 'reason', |
|
|
|
render: (text, r, index) => { |
|
|
|
return index + 1; |
|
|
|
return text; |
|
|
|
}, |
|
|
|
}, { |
|
|
|
title: "类型", |
|
|
|
dataIndex: "type", |
|
|
|
key: 'type', |
|
|
|
dataIndex: "compensate", |
|
|
|
key: 'compensate', |
|
|
|
render: (text, r, index) => { |
|
|
|
return index + 1; |
|
|
|
return text; |
|
|
|
}, |
|
|
|
}, { |
|
|
|
title: "发起时间", |
|
|
|
dataIndex: "originatingTime", |
|
|
|
key: 'originatingTime', |
|
|
|
dataIndex: "createTime", |
|
|
|
key: 'createTime', |
|
|
|
render: (text, r, index) => { |
|
|
|
return index + 1; |
|
|
|
return moment(text).format('YYYY-MM-DD HH:mm'); |
|
|
|
}, |
|
|
|
}, { |
|
|
|
title: "开始时间", |
|
|
|
dataIndex: "startTime", |
|
|
|
key: 'startTime', |
|
|
|
render: (text, r, index) => { |
|
|
|
return index + 1; |
|
|
|
return moment(text).format('YYYY-MM-DD HH:mm'); |
|
|
|
}, |
|
|
|
}, { |
|
|
|
title: "结束时间", |
|
|
|
dataIndex: "endTime", |
|
|
|
key: 'endTime', |
|
|
|
render: (text, r, index) => { |
|
|
|
return index + 1; |
|
|
|
return moment(text).format('YYYY-MM-DD HH:mm'); |
|
|
|
}, |
|
|
|
}, { |
|
|
|
title: "总计时间", |
|
|
|
dataIndex: "allTime", |
|
|
|
key: 'allTime', |
|
|
|
dataIndex: "duration", |
|
|
|
key: 'duration', |
|
|
|
render: (text, r, index) => { |
|
|
|
return index + 1; |
|
|
|
return (text / 60 / 60 + '小时'); |
|
|
|
}, |
|
|
|
}, |
|
|
|
]) |
|
|
|
const [leaveColumns, setLeaveColumns] = useState([//表格属性 |
|
|
|
{ |
|
|
|
title: "实例号", |
|
|
|
dataIndex: "index", |
|
|
|
key: 'index', |
|
|
|
dataIndex: "storyId", |
|
|
|
key: 'storyId', |
|
|
|
render: (text, r, index) => { |
|
|
|
return index + 1; |
|
|
|
return <span style={{ color: '#1890FF' }}>{text}</span>; |
|
|
|
}, |
|
|
|
}, { |
|
|
|
title: "事由", |
|
|
|
dataIndex: "why", |
|
|
|
key: 'why', |
|
|
|
dataIndex: "reason", |
|
|
|
key: 'reason', |
|
|
|
render: (text, r, index) => { |
|
|
|
return index + 1; |
|
|
|
return text; |
|
|
|
}, |
|
|
|
}, { |
|
|
|
title: "类型", |
|
|
|
dataIndex: "type", |
|
|
|
key: 'type', |
|
|
|
render: (text, r, index) => { |
|
|
|
return index + 1; |
|
|
|
return text; |
|
|
|
}, |
|
|
|
}, { |
|
|
|
title: "发起时间", |
|
|
|
dataIndex: "originatingTime", |
|
|
|
key: 'originatingTime', |
|
|
|
dataIndex: "createTime", |
|
|
|
key: 'createTime', |
|
|
|
render: (text, r, index) => { |
|
|
|
return index + 1; |
|
|
|
return moment(text).format('YYYY-MM-DD HH:mm'); |
|
|
|
}, |
|
|
|
}, { |
|
|
|
title: "开始时间", |
|
|
|
dataIndex: "startTime", |
|
|
|
key: 'startTime', |
|
|
|
render: (text, r, index) => { |
|
|
|
return index + 1; |
|
|
|
return moment(text).format('YYYY-MM-DD HH:mm'); |
|
|
|
}, |
|
|
|
}, { |
|
|
|
title: "结束时间", |
|
|
|
dataIndex: "endTime", |
|
|
|
key: 'endTime', |
|
|
|
render: (text, r, index) => { |
|
|
|
return index + 1; |
|
|
|
return moment(text).format('YYYY-MM-DD HH:mm'); |
|
|
|
}, |
|
|
|
}, { |
|
|
|
title: "总计时间", |
|
|
|
dataIndex: "allTime", |
|
|
|
key: 'allTime', |
|
|
|
dataIndex: "duration", |
|
|
|
key: 'duration', |
|
|
|
render: (text, r, index) => { |
|
|
|
return index + 1; |
|
|
|
return (text / 60 / 60 + '小时'); |
|
|
|
}, |
|
|
|
}, |
|
|
|
]) |
|
|
@ -135,11 +137,13 @@ const Rest = (props) => { |
|
|
|
const [endDate, setEndDate] = useState('');//结束时间 |
|
|
|
|
|
|
|
useEffect(() => { |
|
|
|
getWorkOption()//加班信息 |
|
|
|
getLeaveOption()//请假信息 |
|
|
|
setPepUserId(history?.location?.search.slice(1)) |
|
|
|
peopleDetail() |
|
|
|
}, []) |
|
|
|
useEffect(() => { |
|
|
|
getWorkOption()//加班信息 |
|
|
|
getLeaveOption()//请假信息 |
|
|
|
}, [startDate, endDate]) |
|
|
|
function peopleDetail () { |
|
|
|
dispatch(humanAffairs.getMemberList({ keywordTarget: 'number', keyword: history?.location?.search.slice(1) })).then((res) => {//搜索项企用户 |
|
|
|
if (res.success) { |
|
|
@ -150,7 +154,8 @@ const Rest = (props) => { |
|
|
|
function getWorkOption () {//请假折线图 |
|
|
|
dispatch(humanAffairs.getMemberOvertime({ pepUserId: history?.location?.search.slice(1), startDate: startDate, endDate: endDate })).then((res) => {//搜索项企用户 |
|
|
|
if (res.success) { |
|
|
|
console.log('res.success', res.payload.data); |
|
|
|
setTableData(res.payload?.data?.data) |
|
|
|
setTableStatistic(res.payload?.data) |
|
|
|
} |
|
|
|
}) |
|
|
|
var date = []; |
|
|
@ -241,7 +246,30 @@ const Rest = (props) => { |
|
|
|
function getLeaveOption () {//请假折线图 |
|
|
|
dispatch(humanAffairs.getMemberVacate({ pepUserId: history?.location?.search.slice(1), startDate: startDate, endDate: endDate })).then((res) => {//搜索项企用户 |
|
|
|
if (res.success) { |
|
|
|
console.log('res.success', res.payload.data); |
|
|
|
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 |
|
|
|
}) |
|
|
|
} |
|
|
|
}) |
|
|
|
var date = []; |
|
|
@ -310,6 +338,7 @@ const Rest = (props) => { |
|
|
|
setLeaveOption(data) |
|
|
|
} |
|
|
|
function handleChange (date) { |
|
|
|
console.log('datedatedatedate', date); |
|
|
|
setStartDate(moment(date[0]).format('YYYY-MM-DD')) |
|
|
|
setEndDate(moment(date[1]).format('YYYY-MM-DD')) |
|
|
|
|
|
|
@ -648,7 +677,7 @@ const Rest = (props) => { |
|
|
|
加班次数: |
|
|
|
</div> |
|
|
|
<div style={{ fontSize: 14, color: '#005ABD', marginLeft: 5 }}> |
|
|
|
25次 |
|
|
|
{tableData.length}次 |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div style={{ display: 'flex', alignItems: 'center', width: '19.124%' }}> |
|
|
@ -656,7 +685,7 @@ const Rest = (props) => { |
|
|
|
工作日: |
|
|
|
</div> |
|
|
|
<div style={{ fontSize: 14, color: '#005ABD', marginLeft: 5 }}> |
|
|
|
115小时 |
|
|
|
{tableStatistic.sumPayWorkday / 60 / 60 + tableStatistic.sumTakeRestWorkday / 60 / 60||0}小时 |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div style={{ display: 'flex', alignItems: 'center', width: '19.87%' }}> |
|
|
@ -664,7 +693,7 @@ const Rest = (props) => { |
|
|
|
普通假日: |
|
|
|
</div> |
|
|
|
<div style={{ fontSize: 14, color: '#005ABD', marginLeft: 5 }}> |
|
|
|
12小时 |
|
|
|
{tableStatistic.sumTakeRestDayoff / 60 / 60 + tableStatistic.sumTakeRestDayoff / 60 / 60||0}小时 |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div style={{ display: 'flex', alignItems: 'center', width: '19.03%' }}> |
|
|
@ -672,7 +701,7 @@ const Rest = (props) => { |
|
|
|
法定假日: |
|
|
|
</div> |
|
|
|
<div style={{ fontSize: 14, color: '#005ABD', marginLeft: 5 }}> |
|
|
|
1小时 |
|
|
|
{tableStatistic.sumPayFestivals / 60 / 60 + tableStatistic.sumTakeRestFestivals / 60 / 60||0}小时 |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div style={{ display: 'flex', alignItems: 'center', width: '19.217%' }}> |
|
|
@ -680,7 +709,7 @@ const Rest = (props) => { |
|
|
|
累计加班时长: |
|
|
|
</div> |
|
|
|
<div style={{ fontSize: 14, color: '#005ABD', marginLeft: 5 }}> |
|
|
|
436小时 |
|
|
|
{tableStatistic.sumPayWorkday / 60 / 60 + tableStatistic.sumTakeRestWorkday / 60 / 60 + tableStatistic.sumTakeRestDayoff / 60 / 60 + tableStatistic.sumTakeRestDayoff / 60 / 60 + tableStatistic.sumPayFestivals / 60 / 60 + tableStatistic.sumTakeRestFestivals / 60 / 60||0}小时 |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
@ -716,44 +745,52 @@ const Rest = (props) => { |
|
|
|
<div style={{ marginLeft: 17, boxShadow: '0px 0px 8px 1px rgba(0,0,0,0.1)', width: '64.424%' }}> |
|
|
|
<div style={{ display: 'flex', background: '#F4F5FC', height: 40, alignItems: 'center', width: '100%' }}> |
|
|
|
<div style={{ width: 6, height: 40, background: '#005ABD' }}></div> |
|
|
|
<div style={{ display: 'flex', alignItems: 'center', marginLeft: 24, width: '19.964%' }}> |
|
|
|
<div style={{ display: 'flex', alignItems: 'center', marginLeft: 24, width: '16.964%' }}> |
|
|
|
<div style={{ fontSize: 13, color: '#4A4A4A' }}> |
|
|
|
请假次数: |
|
|
|
</div> |
|
|
|
<div style={{ fontSize: 14, color: '#005ABD', marginLeft: 5 }}> |
|
|
|
25次 |
|
|
|
{leaveData.length}次 |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div style={{ display: 'flex', alignItems: 'center', width: '19.124%' }}> |
|
|
|
<div style={{ display: 'flex', alignItems: 'center', width: '15.124%' }}> |
|
|
|
<div style={{ fontSize: 13, color: '#4A4A4A' }}> |
|
|
|
年休假: |
|
|
|
</div> |
|
|
|
<div style={{ fontSize: 14, color: '#005ABD', marginLeft: 5 }}> |
|
|
|
115小时 |
|
|
|
{leaveStatistic.year}小时 |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div style={{ display: 'flex', alignItems: 'center', width: '19.87%' }}> |
|
|
|
<div style={{ display: 'flex', alignItems: 'center', width: '15.87%' }}> |
|
|
|
<div style={{ fontSize: 13, color: '#4A4A4A' }}> |
|
|
|
事假: |
|
|
|
</div> |
|
|
|
<div style={{ fontSize: 14, color: '#005ABD', marginLeft: 5 }}> |
|
|
|
12小时 |
|
|
|
{leaveStatistic.compassionate}小时 |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div style={{ display: 'flex', alignItems: 'center', width: '19.03%' }}> |
|
|
|
<div style={{ display: 'flex', alignItems: 'center', width: '15.03%' }}> |
|
|
|
<div style={{ fontSize: 13, color: '#4A4A4A' }}> |
|
|
|
病假: |
|
|
|
</div> |
|
|
|
<div style={{ fontSize: 14, color: '#005ABD', marginLeft: 5 }}> |
|
|
|
1小时 |
|
|
|
{leaveStatistic.sick}小时 |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div style={{ display: 'flex', alignItems: 'center', width: '19.217%' }}> |
|
|
|
<div style={{ display: 'flex', alignItems: 'center', width: '18%' }}> |
|
|
|
<div style={{ fontSize: 13, color: '#4A4A4A' }}> |
|
|
|
其他类型请假: |
|
|
|
</div> |
|
|
|
<div style={{ fontSize: 14, color: '#005ABD', marginLeft: 5 }}> |
|
|
|
{leaveStatistic.other}小时 |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div style={{ display: 'flex', alignItems: 'center', width: '16.217%' }}> |
|
|
|
<div style={{ fontSize: 13, color: '#4A4A4A' }}> |
|
|
|
剩余年假: |
|
|
|
合计请假时长: |
|
|
|
</div> |
|
|
|
<div style={{ fontSize: 14, color: '#005ABD', marginLeft: 5 }}> |
|
|
|
436小时 |
|
|
|
{leaveStatistic.all}小时 |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|