free-sun
/
HumanResource
18
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

加班折线图

master
deartibers 2 years ago
parent
808c3ac92f
commit
0c3eada585
6 changed files with 338 additions and 239 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 8
      web/client/src/components/setup.jsx
  2. 11
      web/client/src/sections/humanAffairs/actions/employeeInformation.js
  3. 325
      web/client/src/sections/humanAffairs/containers/employeeInformation.jsx
  4. 6
      web/client/src/sections/humanAffairs/containers/personnelFilesDetail.jsx
  5. 9
      web/client/src/sections/humanAffairs/style.less
  6. 2
      web/client/src/utils/webapi.js

8
web/client/src/components/setup.jsx
View File

@ -12,9 +12,6 @@ function Setup(props) {
tableList,
length
} = props;
console.log(tableType,
tableList);
const [check, setCheck] = useState([]);
const checkboxcss = { width: "25%", height: 16, margin: "0 0 20px 0" };
@ -55,7 +52,7 @@ function Setup(props) {
: "rgba(176, 176, 176, 1)",
}}
>
{check.length}/length
{check.length}/{length}
</span>
</div>
}
@ -116,7 +113,8 @@ function Setup(props) {
})}
</div>
</div>
)})}
)
})}
</CheckboxGroup>
</Modal>
);

11
web/client/src/sections/humanAffairs/actions/employeeInformation.js
View File

@ -13,3 +13,14 @@ export function getMemberNativePlace(query) {//查询籍贯列表
reducer: { name: "MemberNativePlace", params: { noClear: true } },
});
}
export function getMemberWorkPlace(query) {//查询工作地列表
return (dispatch) => basicAction({
type: "get",
dispatch: dispatch,
actionType: "GET_MemberWorkPlace",
query: query,
url: `${ApiTable.getMemberWorkPlace}`,
msg: { option: "查询工作地列表" },
reducer: { name: "MemberWorkPlace", params: { noClear: true } },
});
}

325
web/client/src/sections/humanAffairs/containers/employeeInformation.jsx
View File

@ -1,7 +1,8 @@
import React, { useEffect, useState, useRef } from 'react';
import { connect } from 'react-redux';
import { Select, SkeletonScreen, Button, Pagination, Skeleton, Form } from '@douyinfe/semi-ui';
import { Table, Button, Pagination, Skeleton, Form, Tooltip } from '@douyinfe/semi-ui';
import { IconSearch } from '@douyinfe/semi-icons';
import { SkeletonScreen } from "$components";
import '../style.less'
import { Setup } from "$components";
import moment from 'moment'
@ -13,13 +14,9 @@ const employeeInformation = (props) => {
const { humanAffairs } = actions;
const form = useRef();//表单
let [archivesList, setArchivesList] = useState([]);
const [personnelModal, setPersonnelModal] = useState(false);//档案弹框
const [exportModalVs, setExportModalVs] = useState(false);
const [keyword, setKeyword] = useState('');//搜索内容
const [keywordTarget, setKeywordTarget] = useState('');//搜索类型
const [downloadUrl, setDownloadUrl] = useState('')
let [typeChoose, setTypeChoose] = useState('');
let [archivesList, setArchivesList] = useState([]);//人员列表
let [workPlaceList, setWorkPlaceList] = useState([]);//工作地点
let [nativeList, setNativeList] = useState([]);//户籍地
const [setup, setSetup] = useState(false);//表格设置是否显现
const [setupp, setSetupp] = useState([]);//实际显示的表格列表
@ -29,49 +26,62 @@ const employeeInformation = (props) => {
const EMPLOYEEINFORMATION = "employeeInformation";
const tableList = [//表格属性
{
title: '推送信息',
title: '基础信息',
list: [
{ name: "策略类型", value: "pushWay" },
{ name: "推送机制", value: "noticeWay" },
{ name: "监听设备数量", value: "monitorCount" },
{ name: "累计推送次数", value: "logCount" },
{ name: "员工编号", value: "userCode" },
{ name: "姓名", value: "userName" },
{ name: "所属部门", value: "departmrnt" },
// { name: "监听设备数量", value: "monitorCount" },
// { name: "累计推送次数", value: "logCount" },
]
}
];
useEffect(() => {
getMemberSearchList()
getMemberNativePlaceList()
// attribute();
// localStorage.getItem(EMPLOYEEINFORMATION) == null
// ? localStorage.setItem(
// EMPLOYEEINFORMATION,
// JSON.stringify(['pushWay','noticeWay','logCount','monitorCount'])
// )
// : "";
}, [typeChoose])
getMemberNativePlaceList()//查询籍贯列表
getMemberWorkPlaceList()//查询工作地列表
getMemberSearchList()//查询人员列表
attribute();
localStorage.getItem(EMPLOYEEINFORMATION) == null
? localStorage.setItem(
EMPLOYEEINFORMATION,
JSON.stringify(['userCode', 'userName', 'departmrnt'])
)
: "";
}, [])
function getMemberSearchList () {//搜索项企用户
dispatch(humanAffairs.getMemberList({ keywordTarget, keyword, state: typeChoose })).then((res) => {//搜索项企用户
function getMemberSearchList () {//查询人员列表
let obj = form.current.getValues()
if (form.current.getValues().entryTime?.length > 1) {
obj.hiredateStart = moment(form.current.getValues().entryTime[0]).format('YYYY-MM-DD')
obj.hiredateEnd = moment(form.current.getValues().entryTime[1]).format('YYYY-MM-DD')
}
else {
obj.hiredateStart = ''
obj.hiredateEnd = ''
}
setQuery({ limit: 10, page: 0 })
dispatch(humanAffairs.getMemberList({ ...obj, ...query })).then((res) => {//查询人员列表
if (res.success) {
setArchivesList(res.payload?.data?.rows)
setLimits(res.payload?.data?.count)
}
})
}
function getMemberNativePlaceList () {
dispatch(humanAffairs.getMemberNativePlace()).then((res) => {//搜索项企用户
dispatch(humanAffairs.getMemberNativePlace()).then((res) => {//查询籍贯列表
if (res.success) {
// setArchivesList(res.payload?.data?.rows)
console.log('res.payload?.data?.rows',res.payload?.data);
setNativeList(res.payload?.data)
}
})
}
function typeOnChange (e) {//角色选择
setTypeChoose(e.target.value);
function getMemberWorkPlaceList () {
dispatch(humanAffairs.getMemberWorkPlace()).then((res) => {//查询工作地列表
if (res.success) {
setWorkPlaceList(res.payload?.data)
}
function seachValueChange (value) {
setKeyword(value)
})
}
const columns = [];
//获取表格属性设置
function attribute () {
const arr = localStorage.getItem(EMPLOYEEINFORMATION)
@ -80,61 +90,117 @@ const employeeInformation = (props) => {
const column = [
{
title: "关联项目",
dataIndex: "noticeWay",
key: "noticeWay",
render: (_, r, index) => {
return r.noticeWay;
},
},
{
title: "创建时间",
dataIndex: "logCount",
key: "logCount",
render: (_, r, index) => {
return (r.logCount + '次')
},
},
{
title: "接收人",
dataIndex: "monitorCount",
key: "monitorCount",
title: (
<div>
<img src="/assets/images/hrImg/V.png" alt="" style={{ width: 14, height: 14 }} /> 员工编号
</div>
),
dataIndex: "userCode",
key: "userCode",
render: (_, r, index) => {
return r.monitorCount
},
return r.userCode;
},
{
title: "监听问题",
dataIndex: "pushWay",
key: "pushWay",
}, {
title: (
<div>
<img src="/assets/images/hrImg/V.png" alt="" style={{ width: 14, height: 14 }} /> 姓名
</div>
),
dataIndex: "userName",
key: "userName",
render: (_, r, index) => {
return r.pushWay == 'email' ? '邮件通知' : '短信通知';
},
return r.userName;
},
{
title: "通知时效",
dataIndex: "text1",
key: "text1",
}, {
title: (
<div>
<img src="/assets/images/hrImg/V.png" alt="" style={{ width: 14, height: 14 }} /> 所属部门
</div>
),
dataIndex: "departmrnt",
key: "departmrnt",
render: (_, r, index) => {
return r.text1
},
},
return (
<div>
{
title: "启用状态",
dataIndex: "text2",
key: "text2",
render: (_, r, index) => {
return r.text2
},
},
r.departmrnt.map((ite, idx) => {
let departmentsArr = []
for (let i = 0; i < r.departmrnt.length; i++) {
departmentsArr.push(r.departmrnt[i].name)
}
return (
<div key={idx} style={{ display: 'flex' }}>
{idx == 0 ?
(<div style={{ padding: '0px 4px 1px 4px ', color: '#FFFFFF', fontSize: 12, background: 'rgba(0,90,189,0.8)', borderRadius: 2, marginRight: 4 }}>
{ite.name}
</div>) : ('')
}
{
title: "推送次数",
dataIndex: "time",
key: "time",
render: (_, r, index) => {
return r.time
r.departmrnt.length > 1 && idx == 1 ? (
<Tooltip content={departmentsArr.join(',')} trigger="click" style={{ lineHeight: 2 }}>
<div style={{ padding: '0px 4px 1px 4px ', color: '#FFFFFF', fontSize: 12, background: 'rgba(0,90,189,0.8)', borderRadius: 2, marginRight: 4, cursor: "pointer", }}>
...
</div>
</Tooltip>
) : ('')
}
</div>
)
})
}
</div>
)
},
},
// {
// title: "创建时间",
// dataIndex: "logCount",
// key: "logCount",
// render: (_, r, index) => {
// return (r.logCount + '次')
// },
// },
// {
// title: "接收人",
// dataIndex: "monitorCount",
// key: "monitorCount",
// render: (_, r, index) => {
// return r.monitorCount
// },
// },
// {
// title: "监听问题",
// dataIndex: "pushWay",
// key: "pushWay",
// render: (_, r, index) => {
// return r.pushWay == 'email' ? '邮件通知' : '短信通知';
// },
// },
// {
// title: "通知时效",
// dataIndex: "text1",
// key: "text1",
// render: (_, r, index) => {
// return r.text1
// },
// },
// {
// title: "启用状态",
// dataIndex: "text2",
// key: "text2",
// render: (_, r, index) => {
// return r.text2
// },
// },
// {
// title: "推送次数",
// dataIndex: "time",
// key: "time",
// render: (_, r, index) => {
// return r.time
// },
// },
];
for (let i = 0; i < arr.length; i++) {
let colum = column.filter((item) => {
@ -144,6 +210,18 @@ const employeeInformation = (props) => {
}
setSetupp(columns);
}
function handleRow (record, index) {//斑马条纹
// 给偶数行设置斑马纹
if (index % 2 === 0) {
return {
style: {
background: '#FAFCFF',
}
};
} else {
return {};
}
}
return (
<>
<div style={{ padding: '0px 12px' }}>
@ -174,77 +252,85 @@ const employeeInformation = (props) => {
>
<div>
<div style={{ display: 'flex', alignItems: 'center' }}>
<Form.Select value={keywordTarget}
pure onChange={setKeywordTarget} placeholder='请选择搜索类型' style={{ width: 200 }} showClear>
<Select.Option value='role'>职位</Select.Option>
<Select.Option value='dep'>部门</Select.Option>
<Select.Option value='number'>编号</Select.Option>
<Select.Option value='name'>姓名</Select.Option>
<Form.Select
pure
field="keywordTarget"
placeholder="请选择搜索类型"
style={{ width: 200 }}
showClear
>
<Form.Select.Option value='role'>职位</Form.Select.Option>
<Form.Select.Option value='dep'>部门</Form.Select.Option>
<Form.Select.Option value='number'>编号</Form.Select.Option>
<Form.Select.Option value='name'>姓名</Form.Select.Option>
</Form.Select>
<Form.Input suffix={<IconSearch />}
<Form.Input
suffix={<IconSearch />}
field="keyword"
pure
showClear
placeholder='请输入或选择关键词'
value={keyword}
style={{ width: 346, marginLeft: 12, marginRight: 12 }}
onChange={seachValueChange}>
</Form.Input>
placeholder="请输入或选择关键词"
/>
<Form.DatePicker
label='入职时间:'
field='enableType' type="dateRange" density="compact" showClear style={{ width: 370, color: "#F9F9F9" }} />
field='entryTime' type="dateRange" density="compact" showClear style={{ width: 370, color: "#F9F9F9" }} />
</div>
<div style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between' }}>
<div style={{ display: 'flex', alignItems: 'center' }}>
<Form.Select
label='婚姻状况:'
label="婚育状态:"
field="marital"
labelPosition="left"
field='enableType'
style={{ width: 246, marginRight: 20, color: "#F9F9F9", }}
placeholder="全部"
filter
style={{ width: 246, marginRight: 20, color: "#F9F9F9", }}
showClear
>
{/* {.map((item) => {
return (
<Form.Select.Option key={item.value} value={item.value}>
{item.name}
<Form.Select.Option value=''>
全部
</Form.Select.Option>
<Form.Select.Option value='已婚已育'>
已婚已育
</Form.Select.Option>
<Form.Select.Option value='已婚'>
已婚
</Form.Select.Option>
<Form.Select.Option value='未婚'>
未婚
</Form.Select.Option>
);
})} */}
</Form.Select>
<Form.Select
label='户籍地:'
labelPosition="left"
field='enableType'
field='native'
style={{ width: 246, marginRight: 20, color: "#F9F9F9", }}
placeholder="全部"
filter
showClear
>
{/* {.map((item) => {
{nativeList.map((item) => {
return (
<Form.Select.Option key={item.value} value={item.value}>
{item.name}
<Form.Select.Option key={item.nativePlace} value={item.nativePlace}>
{item.nativePlace}
</Form.Select.Option>
);
})} */}
})}
</Form.Select>
<Form.Select
label='工作地点:'
labelPosition="left"
field='enableType'
field='workPlace'
style={{ width: 246, marginRight: 20, color: "#F9F9F9", }}
placeholder="全部"
filter
showClear
>
{/* {.map((item) => {
{workPlaceList.map((item) => {
return (
<Form.Select.Option key={item.value} value={item.value}>
{item.name}
<Form.Select.Option key={item.workPlace} value={item.workPlace}>
{item.workPlace}
</Form.Select.Option>
);
})} */}
})}
</Form.Select>
</div>
<div style={{ display: 'flex', alignItems: 'center' }}>
@ -256,11 +342,7 @@ const employeeInformation = (props) => {
/>
<Button theme='solid' type='primary' style={{ width: 80, borderRadius: 2, height: 32, background: '#DBECFF', color: '#005ABD' }}
onClick={() => {
// dispatch(humanAffairs.getMemberList({ keywordTarget, keyword, state: typeChoose })).then((res) => {//搜索项企用户
// if (res.success) {
// setArchivesList(res.payload.data.rows)
// }
// })
getMemberSearchList()
}}>查询</Button>
</div>
</div>
@ -272,7 +354,7 @@ const employeeInformation = (props) => {
<img src="/assets/images/hrImg/V.png" alt="" style={{ width: 14, height: 14 }} />
"信息的为系统基础数据，来源于项企PEP、钉钉等系统，其他数据均为导入或自定义数据
</div>
{/* <div style={{ marginTop: 20 }}>
<div style={{ marginTop: 20 }}>
<Skeleton
// loading={loading}
loading={false}
@ -281,12 +363,11 @@ const employeeInformation = (props) => {
>
<Table
columns={setupp.filter((s) => s)}
dataSource={tableData}
dataSource={archivesList}
bordered={false}
empty="暂无数据"
pagination={false}
onRow={handleRow}
rowSelection={rowSelection}
/>
</Skeleton>
<div
@ -315,7 +396,7 @@ const employeeInformation = (props) => {
/>
</div>
</div>
</div> */}
</div>
</div>
</div>
</div>

6
web/client/src/sections/humanAffairs/containers/personnelFilesDetail.jsx
View File

@ -164,14 +164,14 @@ const Rest = (props) => {
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')
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')
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')
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 {

9
web/client/src/sections/humanAffairs/style.less
View File

@ -0,0 +1,9 @@
.semi-table{
.semi-table-row:first-child{
.semi-table-row-head{
background: #F2F3F5;
color: #4A4A4A;
font-size: 14px;
}
}
}

2
web/client/src/utils/webapi.js
View File

@ -27,7 +27,7 @@ export const ApiTable = {
getMemberVacate: 'member/vacate',//查询单个人员请假统计数据
getMemberExport: 'member/export',//导出员工信息
getMemberNativePlace: 'member/native_place',//查询籍贯列表
getMemberWorkPlace: 'member/work_place',//查询工作地列表
};
export const RouteTable = {
apiRoot: "/api/root",

Write Preview
Loading…
Cancel
Save