deartibers
2 years ago
33 changed files with 1532 additions and 196 deletions
|
After Width: | Height: | Size: 690 KiB |
|
After Width: | Height: | Size: 27 KiB |
|
After Width: | Height: | Size: 982 B |
|
After Width: | Height: | Size: 529 B |
|
After Width: | Height: | Size: 39 KiB |
|
After Width: | Height: | Size: 1.3 KiB |
|
After Width: | Height: | Size: 597 B |
|
After Width: | Height: | Size: 1.3 KiB |
|
After Width: | Height: | Size: 1.1 KiB |
|
After Width: | Height: | Size: 663 B |
|
After Width: | Height: | Size: 453 B |
|
After Width: | Height: | Size: 607 B |
|
After Width: | Height: | Size: 778 B |
|
After Width: | Height: | Size: 1.4 KiB |
|
After Width: | Height: | Size: 1.5 KiB |
|
After Width: | Height: | Size: 596 B |
@ -0,0 +1,6 @@ |
|||
'use strict'; |
|||
|
|||
import * as personnelFiles from './personnelFiles' |
|||
export default { |
|||
...personnelFiles, |
|||
} |
|||
@ -0,0 +1,15 @@ |
|||
'use strict'; |
|||
|
|||
import { ApiTable, basicAction } from '$utils' |
|||
|
|||
export function getMemberSearch (query) {//搜索项企用户
|
|||
return (dispatch) => basicAction({ |
|||
type: "get", |
|||
dispatch: dispatch, |
|||
actionType: "GET_MemberSearch", |
|||
query: query, |
|||
url: `${ApiTable.getMemberSearch}`, |
|||
msg: { option: "搜索项企用户" }, |
|||
reducer: { name: "MemberSearch", params: { noClear: true } }, |
|||
}); |
|||
} |
|||
@ -0,0 +1,273 @@ |
|||
import React, { useState, useRef, useEffect } from "react"; |
|||
import { connect } from "react-redux"; |
|||
import { Modal, Form } from "@douyinfe/semi-ui"; |
|||
import { IconAlertCircle } from '@douyinfe/semi-icons'; |
|||
|
|||
|
|||
function pushModal (props) { |
|||
const { |
|||
close, |
|||
cancel, |
|||
visible, |
|||
dispatch, |
|||
pepList, |
|||
actions, |
|||
adminEdit,//是否是编辑 |
|||
editObj, |
|||
} = props; |
|||
const { install } = actions; |
|||
const form = useRef();//表单 |
|||
const [disablePeople, setDisablePeople] = useState(true); //页码信息 |
|||
const [peopleList, setPeopleList] = useState([]); //人员List |
|||
const [departmentId, setDepartmentId] = useState(); //部门id |
|||
const [peopleId, setPeopleId] = useState(); //人员id |
|||
//初始化 |
|||
useEffect(() => { |
|||
// if (editObj.id) { |
|||
// let departmentList = [] |
|||
// for (let i = 0; i < pepList.length; i++) { |
|||
// if (pepList[i].id == editObj.departments[0].id) { |
|||
// departmentList = pepList[i].users |
|||
// } |
|||
// } |
|||
// setPeopleList(departmentList) |
|||
// setDepartmentId(editObj.departments[0].id) |
|||
// setPeopleId(editObj.pepUserId) |
|||
// setDisablePeople(false) |
|||
// } |
|||
}, []); |
|||
|
|||
function handleOk () { |
|||
//点击弹框确定 右边按钮 |
|||
form.current |
|||
.validate() |
|||
.then((values) => { |
|||
if (adminEdit) { |
|||
|
|||
} |
|||
else { |
|||
|
|||
} |
|||
}) |
|||
} |
|||
function handleCancel () { |
|||
cancel(); |
|||
//点击弹框取消 左边按钮 |
|||
} |
|||
return ( |
|||
<> |
|||
<Modal |
|||
title={editObj?.id ? '修改档案' : '新增档案'} |
|||
okText="确定" |
|||
cancelText="取消" |
|||
visible={visible} |
|||
onOk={handleOk} |
|||
width={966} |
|||
onCancel={handleCancel} |
|||
> |
|||
<div style={{ borderBottom: '1px solid #DCDEE0', margin: '0px -24px' }}></div> |
|||
<div style={{ margin: "0px 26px" }}> |
|||
<Form |
|||
allowEmpty |
|||
labelPosition="left" |
|||
labelAlign="right" |
|||
labelWidth="98px" |
|||
onValueChange={(values, field) => { |
|||
// for (var key in field) { |
|||
// if (key == 'department') { |
|||
// if (values.department >= 0) { |
|||
// let departmentList = [] |
|||
// for (let i = 0; i < pepList.length; i++) { |
|||
// if (pepList[i].id == values.department) { |
|||
// departmentList = pepList[i].users |
|||
// } |
|||
// } |
|||
// setPeopleList(departmentList) |
|||
// setDisablePeople(false) |
|||
// form.current.setValue('pepUserId', undefined); |
|||
// } |
|||
// else { |
|||
// setPeopleList([]) |
|||
// setDisablePeople(true) |
|||
// form.current.setValue('pepUserId', undefined); |
|||
// } |
|||
// } |
|||
// } |
|||
}} |
|||
getFormApi={(formApi) => (form.current = formApi)} |
|||
> |
|||
<div style={{ width: 846, border: '1px solid rgba(151,151,151,0.2)', marginTop: 18 }}> |
|||
<div style={{ height: 50, padding: '0px 30px', color: '#4A4A4A', fontSize: 14, display: 'flex', alignItems: 'center' }}> |
|||
职务信息 |
|||
</div> |
|||
<div style={{ borderBottom: '1px solid rgba(151,151,151,0.2)', }}></div> |
|||
<div style={{ padding: '20px 30px' }}> |
|||
<div style={{ display: 'flex', alignItems: 'center' }}> |
|||
<Form.Input |
|||
field="pepUserId" |
|||
label='人员编号：' |
|||
style={{ width: 425 }} |
|||
initValue={'' || ""} |
|||
placeholder="请输入人员编号" |
|||
showClear |
|||
rules={[{ required: true, message: "请输入人员编号" }]} /> |
|||
<div style={{ marginLeft: 12, color: '#005ABD', cursor: "pointer", fontSize: 14 }}> |
|||
搜索 |
|||
</div> |
|||
</div> |
|||
<div style={{ width: 786, height: 95, background: '#F4F5FC', border: '1px solid rgba(0, 90, 189, 0.2)', marginTop: 8, padding: '20px 83px 20px 50px' }}> |
|||
<div style={{ display: 'flex', justifyContent: 'space-between' }}> |
|||
<div style={{ display: 'flex', alignItems: 'center' }}> |
|||
<div style={{ width: 16, height: 16, marginRight: 9 }}> |
|||
<img src="/assets/images/hrImg/name.png" alt="" style={{ width: '100%', height: '100%' }} /> |
|||
</div> |
|||
<div style={{ color: 'rgba(0,0,0,0.6)', fontSize: 12 }}> |
|||
姓名： |
|||
</div> |
|||
<div style={{ color: '#4A4A4A', fontSize: 12 }}> |
|||
刘昊然 |
|||
</div> |
|||
</div> |
|||
<div style={{ display: 'flex', alignItems: 'center' }}> |
|||
<div style={{ width: 16, height: 16, marginRight: 9 }}> |
|||
<img src="/assets/images/hrImg/number.png" alt="" style={{ width: '100%', height: '100%' }} /> |
|||
</div> |
|||
<div style={{ color: 'rgba(0,0,0,0.6)', fontSize: 12 }}> |
|||
员工编号： |
|||
</div> |
|||
<div style={{ color: '#4A4A4A', fontSize: 12 }}> |
|||
0001 |
|||
</div> |
|||
</div> |
|||
<div style={{ display: 'flex', alignItems: 'center' }}> |
|||
<div style={{ width: 16, height: 16, marginRight: 9 }}> |
|||
<img src="/assets/images/hrImg/position.png" alt="" style={{ width: '100%', height: '100%' }} /> |
|||
</div> |
|||
<div style={{ color: 'rgba(0,0,0,0.6)', fontSize: 12 }}> |
|||
职位： |
|||
</div> |
|||
<div style={{ color: '#4A4A4A', fontSize: 12 }}> |
|||
产品经理 |
|||
</div> |
|||
</div> |
|||
</div> |
|||
<div style={{ display: 'flex', alignItems: 'center', marginTop: 20 }}> |
|||
<div style={{ width: 16, height: 16, marginRight: 9 }}> |
|||
<img src="/assets/images/hrImg/department.png" alt="" style={{ width: '100%', height: '100%' }} /> |
|||
</div> |
|||
<div style={{ color: 'rgba(0,0,0,0.6)', fontSize: 12 }}> |
|||
所属部门： |
|||
</div> |
|||
<div style={{ color: '#FFFFFF', fontSize: 12, padding: '0px 4px 1px', background: 'rgba(0,90,189,0.8)' }}> |
|||
行业服务部 |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
<div style={{ width: 846, border: '1px solid rgba(151,151,151,0.2)', marginTop: 12 }}> |
|||
<div style={{ height: 50, padding: '0px 30px', color: '#4A4A4A', fontSize: 14, display: 'flex', alignItems: 'center' }}> |
|||
基本信息 |
|||
</div> |
|||
<div style={{ borderBottom: '1px solid rgba(151,151,151,0.2)', }}></div> |
|||
<div style={{ padding: '20px 30px' }}> |
|||
<div style={{ display: 'flex', alignItems: 'center' }}> |
|||
<div> |
|||
<Form.Input |
|||
field="idNumber" |
|||
label='证件号：' |
|||
style={{ width: 364 }} |
|||
initValue={'' || ""} |
|||
placeholder="请输入证件号" |
|||
showClear |
|||
// rules={[{ required: true, message: "请输入证件号" }]} |
|||
/> |
|||
</div> |
|||
<div> |
|||
upload |
|||
</div> |
|||
</div> |
|||
<div style={{ display: 'flex', alignItems: 'center' }}> |
|||
<div> |
|||
<Form.Select |
|||
label="性别：" |
|||
field="gender" |
|||
placeholder="请选择性别" |
|||
style={{ width: 122 }} |
|||
initValue={departmentId || ""} |
|||
showClear |
|||
> |
|||
<Form.Select.Option value='man'> |
|||
男 |
|||
</Form.Select.Option> |
|||
<Form.Select.Option value='woman'> |
|||
女 |
|||
</Form.Select.Option> |
|||
</Form.Select> |
|||
</div> |
|||
<div> |
|||
|
|||
</div> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
{/* <div> |
|||
<Form.Select |
|||
label="选择部门:" |
|||
field="department" |
|||
placeholder="请选择部门" |
|||
style={{ width: 417 }} |
|||
rules={[{ required: true, message: "请选择部门" }]} |
|||
initValue={departmentId || ""} |
|||
showClear |
|||
> |
|||
{ |
|||
pepList.map((item, index) => { |
|||
return ( |
|||
<Form.Select.Option key={index} value={item.id}> |
|||
{item.name} |
|||
</Form.Select.Option> |
|||
) |
|||
}) |
|||
} |
|||
</Form.Select> |
|||
</div> */} |
|||
{/* <div> |
|||
<Form.Select |
|||
label="选择人员:" |
|||
field="pepUserId" |
|||
placeholder="请选择人员" |
|||
style={{ width: 417 }} |
|||
rules={[{ required: true, message: "请选择人员" }]} |
|||
initValue={peopleId || ""} |
|||
showClear |
|||
disabled={disablePeople} |
|||
> |
|||
{ |
|||
peopleList.map((item, index) => { |
|||
return ( |
|||
<Form.Select.Option key={item.id} value={item.id}> |
|||
{item.name} |
|||
</Form.Select.Option> |
|||
) |
|||
}) |
|||
} |
|||
</Form.Select> |
|||
</div> */} |
|||
</Form> |
|||
</div> |
|||
</Modal> |
|||
</> |
|||
); |
|||
} |
|||
function mapStateToProps (state) { |
|||
const { auth, global, members } = state; |
|||
return { |
|||
// loading: members.isRequesting, |
|||
user: auth.user, |
|||
actions: global.actions, |
|||
// members: members.data, |
|||
}; |
|||
} |
|||
|
|||
export default connect(mapStateToProps)(pushModal); |
|||
@ -0,0 +1,6 @@ |
|||
'use strict'; |
|||
|
|||
import PersonnelFiles from './personnelFiles'; |
|||
import PersonnelFilesDetail from './personnelFilesDetail'; |
|||
|
|||
export { PersonnelFiles, PersonnelFilesDetail }; |
|||
@ -0,0 +1,266 @@ |
|||
import React, { useEffect, useState } from 'react'; |
|||
import { connect } from 'react-redux'; |
|||
import { Select, Input, Button, CheckboxGroup } from '@douyinfe/semi-ui'; |
|||
import { IconSearch } from '@douyinfe/semi-icons'; |
|||
import PersonnelModal from '../components/personnelModal'; |
|||
|
|||
import '../style.less' |
|||
|
|||
const Rest = (props) => { |
|||
const { dispatch, actions, history, user, loading, socket } = props |
|||
|
|||
const { humanAffairs } = actions; |
|||
let [departmentValue, setDepartmentValue] = useState(''); |
|||
|
|||
let [archivesList, setArchivesList] = useState(['', '', '', '', '', '', '', '', '', '']); |
|||
const [personnelModal, setPersonnelModal] = useState(false);//档案弹框 |
|||
const options = [ |
|||
{ label: '离职', value: 'abc' }, |
|||
{ label: '请假', value: 'hotsoon' }, |
|||
{ label: '放假', value: 'pipixia' }, |
|||
{ label: '在岗', value: 'toutiao' }, |
|||
{ label: '加班', value: 'jiaban' } |
|||
] |
|||
|
|||
let [seachValue, setSeachValue] = useState(''); |
|||
let [typeChoose, setTypeChoose] = useState([]); |
|||
useEffect(() => { |
|||
getMemberSearchList() |
|||
}, []) |
|||
|
|||
function getMemberSearchList () {//搜索项企用户 |
|||
dispatch(humanAffairs.getMemberSearch()).then((res) => {//搜索项企用户 |
|||
if (res.success) { |
|||
// let mytableData = JSON.parse(JSON.stringify(res.payload.data.rows)); |
|||
// let mytableKey = [] |
|||
// for (let index = 0; index < mytableData.length; index++) { |
|||
// mytableData[index].key = mytableData[index].id |
|||
// mytableKey.push(mytableData[index].id) |
|||
// } |
|||
// setTableKey(mytableKey) |
|||
// setTableData(mytableData) |
|||
// setLimits(res.payload.data.count) |
|||
// mylimits.current = res.payload.data.rows.length |
|||
} |
|||
}) |
|||
} |
|||
|
|||
function typeOnChange (e) {//角色选择 |
|||
console.log('e.target.value', e.target.value); |
|||
setTypeChoose(e.target.value); |
|||
} |
|||
function seachValueChange () { |
|||
|
|||
} |
|||
return ( |
|||
<> |
|||
<div style={{ padding: '0px 12px' }}> |
|||
<div style={{ display: 'flex' }}> |
|||
<div style={{ color: 'rgba(0,0,0,0.45)', fontSize: 14 }}>人事管理</div> |
|||
<div style={{ color: 'rgba(0,0,0,0.45)', fontSize: 14, margin: '0px 8px' }}>/</div> |
|||
<div style={{ color: 'rgba(0,0,0,0.45)', fontSize: 14 }}>档案中心</div> |
|||
<div style={{ color: '#033C9A', fontSize: 14, margin: '0px 8px' }}>/</div> |
|||
<div style={{ color: '#033C9A', fontSize: 14 }}>人员档案</div> |
|||
</div> |
|||
<div style={{ background: '#FFFFFF', boxShadow: '0px 0px 12px 2px rgba(220,222,224,0.2)', borderRadius: 2, padding: '20px 0px 20px 19px ', marginTop: 12 }}> |
|||
<div style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between' }}> |
|||
<div style={{ display: 'flex', alignItems: 'baseline' }}> |
|||
<div style={{ width: 0, height: 20, borderLeft: '3px solid #0F7EFB', borderTop: '3px solid transparent', borderBottom: '3px solid transparent' }}></div> |
|||
<div style={{ fontFamily: "YouSheBiaoTiHei", fontSize: 24, color: '#033C9A', marginLeft: 8 }}>员工档案</div> |
|||
<div style={{ marginLeft: 6, fontSize: 12, color: '#969799', fontFamily: "DINExp", }}>EMPLOYEE FILE</div> |
|||
</div> |
|||
<div style={{ display: 'flex', marginRight: 20 }}> |
|||
<div style={{ padding: '6px 20px', background: '#0F7EFB', color: '#FFFFFF', fontSize: 14, cursor: "pointer" }} |
|||
onClick={() => { |
|||
setPersonnelModal(true); |
|||
}}> |
|||
新增档案 |
|||
</div> |
|||
<div style={{ padding: '6px 20px', background: '#00BA85', color: '#FFFFFF', fontSize: 14, cursor: "pointer", marginLeft: 20 }}> |
|||
导入员工信息 |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
<div style={{ background: '#FFFFFF', boxShadow: '0px 0px 12px 2px rgba(220,222,224,0.2)', borderRadius: 2, padding: '20px 0px 20px 19px ', marginTop: 9 }}> |
|||
<div style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between' }}> |
|||
<div style={{ display: 'flex', alignItems: 'baseline' }}> |
|||
<div style={{ width: 0, height: 20, borderLeft: '3px solid #0F7EFB', borderTop: '3px solid transparent', borderBottom: '3px solid transparent' }}></div> |
|||
<div style={{ fontFamily: "YouSheBiaoTiHei", fontSize: 24, color: '#033C9A', marginLeft: 8 }}>员工档案详情</div> |
|||
<div style={{ marginLeft: 6, fontSize: 12, color: '#969799', fontFamily: "DINExp", }}>EMPLOYEE FILE DETAILS</div> |
|||
</div> |
|||
</div> |
|||
<div style={{ display: 'flex', marginTop: 16, marginBottom: 17 }}> |
|||
<div> |
|||
<Select value={departmentValue} onChange={setDepartmentValue} placeholder='部门' style={{ width: 200 }} showClear> |
|||
<Select.Option value='abc'>抖音</Select.Option> |
|||
<Select.Option value='ulikecam'>轻颜相机</Select.Option> |
|||
<Select.Option value='xigua'>西瓜视频</Select.Option> |
|||
</Select> |
|||
</div> |
|||
<div style={{ marginLeft: 12, marginRight: 18 }}> |
|||
<Input suffix={<IconSearch />} |
|||
showClear |
|||
placeholder='请输入或选择关键词' |
|||
value={seachValue} |
|||
style={{ width: 346 }} |
|||
onChange={seachValueChange}> |
|||
</Input> |
|||
</div> |
|||
<Button theme='solid' type='primary' style={{ width: 80, borderRadius: 2, height: 32, background: '#DBECFF', color: '#005ABD' }}>查询</Button> |
|||
</div> |
|||
<div style={{ borderBottom: '1px solid #F2F3F5', marginLeft: '-20px', marginBottom: 16 }}></div> |
|||
<div style={{ display: 'flex', justifyContent: 'space-between', marginBottom: 22 }}> |
|||
<div style={{ display: 'flex', }}> |
|||
<div style={{ color: '#646566', fontSize: 14 }}> |
|||
当前显示 |
|||
</div> |
|||
<div style={{ color: '#005ABD', fontSize: 14, margin: '0px 10px' }}> |
|||
11条 |
|||
</div> |
|||
<div style={{ color: '#646566', fontSize: 14 }}> |
|||
结果 |
|||
</div> |
|||
</div> |
|||
<div style={{ display: 'flex', marginRight: 30, alignItems: 'center' }}> |
|||
<div style={{ color: '#4A4A4A', fontSize: 13 }}> |
|||
人员状态： |
|||
</div> |
|||
<div> |
|||
<CheckboxGroup options={options} onChange={typeOnChange} value={typeChoose} direction='horizontal' aria-label="CheckboxGroup 示例" /> |
|||
</div> |
|||
<div style={{ display: 'flex', marginLeft: 30, alignItems: 'center' }}> |
|||
<div style={{ width: 20, height: 20 }}> |
|||
<img src="/assets/images/hrImg/export.png" alt="" style={{ width: '100%', height: '100%' }} /> |
|||
</div> |
|||
<div style={{ marginLeft: 4, color: '#005ABD', fontSize: 13 }}> |
|||
导出 |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
<div style={{ display: 'flex', flexWrap: 'wrap', marginLeft: 30 }}> |
|||
{ |
|||
archivesList.map((item, index) => { |
|||
return ( |
|||
<div key={index} style={{ display: 'flex', width: 368, border: '1px solid #F9F9F9', boxShadow: '0px 0px 4px 1px rgba(0,0,0,0.08)', padding: 10, marginRight: 40, marginBottom: 20 }}> |
|||
<div style={{ width: 128, height: 192 }}> |
|||
<img src="/assets/images/hrImg/mc.png" alt="" style={{ width: '100%', height: '100%' }} /> |
|||
</div> |
|||
<div style={{ marginLeft: 4 }}> |
|||
<div style={{ display: 'flex' }}> |
|||
<div style={{ color: '#005ABD', fontSize: 14, marginRight: 6 }}> |
|||
0012 |
|||
</div> |
|||
<div style={{ padding: '0px 4px 1px 4px ', color: '#FFFFFF', fontSize: 12, background: 'rgba(0,90,189,0.8)', borderRadius: 2 }}> |
|||
行业服务部 |
|||
</div> |
|||
{/* <div> |
|||
|
|||
</div> */} |
|||
</div> |
|||
<div style={{ marginTop: 16, display: 'flex', marginLeft: 4 }}> |
|||
<div style={{ display: 'flex', width: 159 }}> |
|||
<div style={{ width: 20, height: 20 }}> |
|||
<img src="/assets/images/hrImg/mc.png" alt="" style={{ width: '100%', height: '100%' }} /> |
|||
</div> |
|||
<div style={{ fontSize: 14, color: '#282828', marginLeft: 12, marginRight: 9 }}> |
|||
刘昊然 |
|||
</div> |
|||
<div style={{ background: '#FFFBE3', padding: '2px 6px 1px', color: '#D3A000', fontSize: 12, borderRadius: '8px 0px 8px 0px' }}> |
|||
请假中 |
|||
</div> |
|||
</div> |
|||
<div style={{ color: 'rgba(0,0,0,0.65)', fontSize: 12 }}> |
|||
23岁 |
|||
</div> |
|||
</div> |
|||
<div style={{ marginTop: 16, display: 'flex', marginLeft: 4 }}> |
|||
<div style={{ display: 'flex', width: 159 }}> |
|||
<div style={{ width: 20, height: 20 }}> |
|||
<img src="/assets/images/hrImg/man.png" alt="" style={{ width: '100%', height: '100%' }} /> |
|||
</div> |
|||
<div style={{ fontSize: 14, color: '#282828', marginLeft: 12, marginRight: 9 }}> |
|||
男 |
|||
</div> |
|||
</div> |
|||
<div style={{ color: 'rgba(0,0,0,0.65)', fontSize: 12 }}> |
|||
未婚 |
|||
</div> |
|||
</div> |
|||
<div style={{ marginTop: 16, display: 'flex', marginLeft: 4 }}> |
|||
<div style={{ display: 'flex', width: 159 }}> |
|||
<div style={{ width: 20, height: 20 }}> |
|||
<img src="/assets/images/hrImg/post.png" alt="" style={{ width: '100%', height: '100%' }} /> |
|||
</div> |
|||
<div style={{ fontSize: 14, color: '#282828', marginLeft: 12, marginRight: 9 }}> |
|||
人力资源部副部长 |
|||
</div> |
|||
</div> |
|||
<div style={{ color: 'rgba(0,0,0,0.65)', fontSize: 12 }}> |
|||
9年经验 |
|||
</div> |
|||
</div> |
|||
<div style={{ marginTop: 16, display: 'flex', marginLeft: 4 }}> |
|||
<div style={{ display: 'flex', width: 159 }}> |
|||
<div style={{ width: 20, height: 20 }}> |
|||
<img src="/assets/images/hrImg/year.png" alt="" style={{ width: '100%', height: '100%' }} /> |
|||
</div> |
|||
<div style={{ fontSize: 14, color: '#282828', marginLeft: 12, marginRight: 9 }}> |
|||
入职3年 |
|||
</div> |
|||
</div> |
|||
<div style={{ color: 'rgba(0,0,0,0.65)', fontSize: 12 }}> |
|||
本科 |
|||
</div> |
|||
</div> |
|||
<div style={{ marginTop: 16, marginLeft: 4 }}> |
|||
<Button theme='solid' type='primary' style={{ width: 212, borderRadius: 17, height: 28 }} |
|||
onClick={() => { |
|||
history.push(`/personnelFilesDetail`); |
|||
}}>详情</Button> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
) |
|||
}) |
|||
} |
|||
|
|||
</div> |
|||
</div> |
|||
</div> |
|||
{//成员弹框 |
|||
personnelModal ? |
|||
<PersonnelModal |
|||
visible={true} |
|||
// pepList={pepList} |
|||
// memberEdit={memberEdit} |
|||
// editObj={editObj} |
|||
// pomsList={pomsList} |
|||
// anxinDelete={anxinDelete} |
|||
// anxincloudArr={anxincloudArr} |
|||
cancel={() => { |
|||
setPersonnelModal(false); |
|||
}} |
|||
close={() => { |
|||
setPersonnelModal(false); |
|||
// getUserList() |
|||
}} > |
|||
</PersonnelModal> : '' |
|||
} |
|||
</> |
|||
) |
|||
} |
|||
|
|||
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); |
|||
@ -0,0 +1,752 @@ |
|||
import React, { useEffect, useState, useMemo } from 'react'; |
|||
import { connect } from 'react-redux'; |
|||
import { Select, Input, Button, CheckboxGroup, DatePicker, Table } from '@douyinfe/semi-ui'; |
|||
import { IconSearch } from '@douyinfe/semi-icons'; |
|||
import ReactECharts from 'echarts-for-react'; |
|||
import * as echarts from 'echarts'; |
|||
|
|||
import '../style.less' |
|||
|
|||
const Rest = (props) => { |
|||
const { dispatch, actions, user, loading, socket } = props |
|||
|
|||
const { humanAffairs } = actions; |
|||
const [option, setOption] = useState({}); |
|||
const [leaveoption, setLeaveOption] = useState({}); |
|||
const [tableData, setTableData] = useState([{}, {}, {}, {}, {}, {}, {}]) //表格数据 |
|||
const [leaveData, setLeaveData] = useState([{}, {}, {}, {}, {}, {}, {}]) //表格数据 |
|||
const [columns, setColumns] = useState([//表格属性 |
|||
{ |
|||
title: "实例号", |
|||
dataIndex: "index", |
|||
key: 'index', |
|||
render: (text, r, index) => { |
|||
return index + 1; |
|||
}, |
|||
}, { |
|||
title: "事由", |
|||
dataIndex: "why", |
|||
key: 'why', |
|||
render: (text, r, index) => { |
|||
return index + 1; |
|||
}, |
|||
}, { |
|||
title: "类型", |
|||
dataIndex: "type", |
|||
key: 'type', |
|||
render: (text, r, index) => { |
|||
return index + 1; |
|||
}, |
|||
}, { |
|||
title: "发起时间", |
|||
dataIndex: "originatingTime", |
|||
key: 'originatingTime', |
|||
render: (text, r, index) => { |
|||
return index + 1; |
|||
}, |
|||
}, { |
|||
title: "开始时间", |
|||
dataIndex: "startTime", |
|||
key: 'startTime', |
|||
render: (text, r, index) => { |
|||
return index + 1; |
|||
}, |
|||
}, { |
|||
title: "结束时间", |
|||
dataIndex: "endTime", |
|||
key: 'endTime', |
|||
render: (text, r, index) => { |
|||
return index + 1; |
|||
}, |
|||
}, { |
|||
title: "总计时间", |
|||
dataIndex: "allTime", |
|||
key: 'allTime', |
|||
render: (text, r, index) => { |
|||
return index + 1; |
|||
}, |
|||
}, |
|||
]) |
|||
const [leaveColumns, setLeaveColumns] = useState([//表格属性 |
|||
{ |
|||
title: "实例号", |
|||
dataIndex: "index", |
|||
key: 'index', |
|||
render: (text, r, index) => { |
|||
return index + 1; |
|||
}, |
|||
}, { |
|||
title: "事由", |
|||
dataIndex: "why", |
|||
key: 'why', |
|||
render: (text, r, index) => { |
|||
return index + 1; |
|||
}, |
|||
}, { |
|||
title: "类型", |
|||
dataIndex: "type", |
|||
key: 'type', |
|||
render: (text, r, index) => { |
|||
return index + 1; |
|||
}, |
|||
}, { |
|||
title: "发起时间", |
|||
dataIndex: "originatingTime", |
|||
key: 'originatingTime', |
|||
render: (text, r, index) => { |
|||
return index + 1; |
|||
}, |
|||
}, { |
|||
title: "开始时间", |
|||
dataIndex: "startTime", |
|||
key: 'startTime', |
|||
render: (text, r, index) => { |
|||
return index + 1; |
|||
}, |
|||
}, { |
|||
title: "结束时间", |
|||
dataIndex: "endTime", |
|||
key: 'endTime', |
|||
render: (text, r, index) => { |
|||
return index + 1; |
|||
}, |
|||
}, { |
|||
title: "总计时间", |
|||
dataIndex: "allTime", |
|||
key: 'allTime', |
|||
render: (text, r, index) => { |
|||
return index + 1; |
|||
}, |
|||
}, |
|||
]) |
|||
const scroll = useMemo(() => ({ y: 248 }), []); |
|||
|
|||
useEffect(() => { |
|||
getMemberSearchList() |
|||
getWorkOption() |
|||
getLeaveOption() |
|||
}, []) |
|||
function getWorkOption () {//请假折线图 |
|||
var date = []; |
|||
date.push([2017, 6, 1].join("/")); |
|||
date.push([2017, 6, 2].join("/")); |
|||
date.push([2017, 6, 3].join("/")); |
|||
date.push([2017, 6, 4].join("/")); |
|||
date.push([2017, 6, 5].join("/")); |
|||
date.push([2017, 6, 6].join("/")); |
|||
date.push([2017, 6, 7].join("/")); |
|||
date.push([2017, 6, 8].join("/")); |
|||
date.push([2017, 6, 9].join("/")); |
|||
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: [ |
|||
["2017/6/1", 1], |
|||
["2017/6/3", 3], |
|||
["2017/6/5", 5], |
|||
["2017/6/7", 4], |
|||
["2017/6/9", 4], |
|||
], |
|||
}, |
|||
{ |
|||
name: "折算", |
|||
type: "line", |
|||
areaStyle: { |
|||
color: 'rgba(254,152,18,0.2)', |
|||
}, |
|||
smooth: true, |
|||
data: [ |
|||
["2017/6/2", 3], |
|||
["2017/6/4", 1], |
|||
["2017/6/6", 6], |
|||
["2017/6/8", 3], |
|||
], |
|||
}, |
|||
], |
|||
} |
|||
setOption(data) |
|||
} |
|||
function getLeaveOption () {//请假折线图 |
|||
var date = []; |
|||
date.push([2017, 6, 1].join("/")); |
|||
date.push([2017, 6, 2].join("/")); |
|||
date.push([2017, 6, 3].join("/")); |
|||
date.push([2017, 6, 4].join("/")); |
|||
date.push([2017, 6, 5].join("/")); |
|||
date.push([2017, 6, 6].join("/")); |
|||
date.push([2017, 6, 7].join("/")); |
|||
date.push([2017, 6, 8].join("/")); |
|||
date.push([2017, 6, 9].join("/")); |
|||
let data = { |
|||
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: [ |
|||
["2017/6/1", 1], |
|||
["2017/6/3", 3], |
|||
["2017/6/5", 5], |
|||
["2017/6/7", 4], |
|||
["2017/6/9", 4], |
|||
], |
|||
}, |
|||
], |
|||
} |
|||
setLeaveOption(data) |
|||
} |
|||
function getMemberSearchList () {//搜索项企用户 |
|||
dispatch(humanAffairs.getMemberSearch()).then((res) => {//搜索项企用户 |
|||
if (res.success) { |
|||
// let mytableData = JSON.parse(JSON.stringify(res.payload.data.rows)); |
|||
// let mytableKey = [] |
|||
// for (let index = 0; index < mytableData.length; index++) { |
|||
// mytableData[index].key = mytableData[index].id |
|||
// mytableKey.push(mytableData[index].id) |
|||
// } |
|||
// setTableKey(mytableKey) |
|||
// setTableData(mytableData) |
|||
// setLimits(res.payload.data.count) |
|||
// mylimits.current = res.payload.data.rows.length |
|||
} |
|||
}) |
|||
} |
|||
return ( |
|||
<> |
|||
<div style={{ padding: '0px 12px' }}> |
|||
<div style={{ display: 'flex' }}> |
|||
<div style={{ color: 'rgba(0,0,0,0.45)', fontSize: 14 }}>人事管理</div> |
|||
<div style={{ color: 'rgba(0,0,0,0.45)', fontSize: 14, margin: '0px 8px' }}>/</div> |
|||
<div style={{ color: 'rgba(0,0,0,0.45)', fontSize: 14 }}>档案中心</div> |
|||
<div style={{ color: 'rgba(0,0,0,0.45)', fontSize: 14, margin: '0px 8px' }}>/</div> |
|||
<div style={{ color: 'rgba(0,0,0,0.45)', fontSize: 14 }}>人员档案</div> |
|||
<div style={{ color: '#033C9A', fontSize: 14, margin: '0px 8px' }}>/</div> |
|||
<div style={{ color: '#033C9A', fontSize: 14 }}>档案详情</div> |
|||
</div> |
|||
<div style={{ background: '#FFFFFF', boxShadow: '0px 0px 12px 2px rgba(220,222,224,0.2)', borderRadius: 2, padding: '20px 0px 20px 19px ', marginTop: 12 }}> |
|||
<div style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between' }}> |
|||
<div style={{ display: 'flex', alignItems: 'baseline' }}> |
|||
<div style={{ width: 20, height: 20, marginRight: 10, cursor: "pointer" }}> |
|||
<img src="/assets/images/hrImg/back.png" alt="" style={{ width: '100%', height: '100%' }} /> |
|||
</div> |
|||
<div style={{ width: 0, height: 20, borderLeft: '3px solid #0F7EFB', borderTop: '3px solid transparent', borderBottom: '3px solid transparent' }}></div> |
|||
<div style={{ fontFamily: "YouSheBiaoTiHei", fontSize: 24, color: '#033C9A', marginLeft: 8 }}>张小小的个人档案</div> |
|||
</div> |
|||
<div style={{ display: 'flex', marginRight: 20 }}> |
|||
<div style={{ padding: '6px 20px', background: '#0F7EFB', color: '#FFFFFF', fontSize: 14, cursor: "pointer" }}> |
|||
编辑档案 |
|||
</div> |
|||
<div style={{ padding: '6px 20px', background: '#FF5254', color: '#FFFFFF', fontSize: 14, cursor: "pointer", marginLeft: 20 }}> |
|||
删除档案 |
|||
</div> |
|||
</div> |
|||
</div> |
|||
<div style={{ borderBottom: '1px solid #DCDEE0', margin: '16px 0px 16px -20px' }}></div> |
|||
<div style={{ display: 'flex', width: '100%' }}> |
|||
<div style={{ width: 160, height: 240, marginLeft: 17 }}> |
|||
<img src="/assets/images/hrImg/mc.png" alt="" style={{ width: '100%', height: '100%' }} /> |
|||
</div> |
|||
<div style={{ marginLeft: 40, marginTop: 8, width: '61.452%' }}> |
|||
<div style={{ display: 'flex' }}> |
|||
{/* 基本信息 */} |
|||
<div style={{ width: '60%' }}> |
|||
<div style={{ color: '#4A4A4A', fontSize: 14, fontWeight: 'bold' }}> |
|||
基本信息 |
|||
</div> |
|||
<div style={{ display: 'flex', marginTop: 13 }}> |
|||
<div style={{ display: 'flex', width: '40.82%' }}> |
|||
<div style={{ color: 'rgba(0, 0, 0,0.6)', fontSize: 12, width: 48 }}> |
|||
证件号： |
|||
</div> |
|||
<div style={{ color: '#4A4A4A', fontSize: 13 }}> |
|||
3211011290000022 |
|||
</div> |
|||
</div> |
|||
<div style={{ display: 'flex', width: '59.18%' }}> |
|||
<div style={{ color: 'rgba(0, 0, 0,0.6)', fontSize: 12, width: 60 }}> |
|||
联系方式： |
|||
</div> |
|||
<div style={{ color: '#4A4A4A', fontSize: 13 }}> |
|||
13221212211 |
|||
</div> |
|||
</div> |
|||
</div> |
|||
<div style={{ display: 'flex', marginTop: 8 }}> |
|||
<div style={{ display: 'flex', width: '40.82%' }}> |
|||
<div style={{ display: 'flex', width: '52.57%' }}> |
|||
<div style={{ color: 'rgba(0, 0, 0,0.6)', fontSize: 12, width: 48, textAlign: 'end' }}> |
|||
姓名： |
|||
</div> |
|||
<div style={{ color: '#005ABD', fontSize: 13 }}> |
|||
刘昊然 |
|||
</div> |
|||
</div> |
|||
<div style={{ display: 'flex', width: '47.43%' }}> |
|||
<div style={{ color: 'rgba(0, 0, 0,0.6)', fontSize: 12, width: 48, textAlign: 'end' }}> |
|||
性别： |
|||
</div> |
|||
<div style={{ color: '#4A4A4A', fontSize: 13 }}> |
|||
男 |
|||
</div> |
|||
</div> |
|||
</div> |
|||
<div style={{ display: 'flex', width: '59.18%' }}> |
|||
<div style={{ display: 'flex', width: '53.166%' }}> |
|||
<div style={{ color: 'rgba(0, 0, 0,0.6)', fontSize: 12, width: 60 }}> |
|||
出生日期： |
|||
</div> |
|||
<div style={{ color: '#4A4A4A', fontSize: 13 }}> |
|||
1998年6月15日 |
|||
</div> |
|||
</div> |
|||
<div style={{ display: 'flex', width: '46.834%' }}> |
|||
<div style={{ color: 'rgba(0, 0, 0,0.6)', fontSize: 12, width: 60 }}> |
|||
政治面貌： |
|||
</div> |
|||
<div style={{ color: '#4A4A4A', fontSize: 13 }}> |
|||
党员 |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
<div style={{ display: 'flex', marginTop: 8 }}> |
|||
<div style={{ display: 'flex', width: '40.82%' }}> |
|||
<div style={{ display: 'flex', width: '52.57%' }}> |
|||
<div style={{ color: 'rgba(0, 0, 0,0.6)', fontSize: 12, width: 48, textAlign: 'end' }}> |
|||
年龄： |
|||
</div> |
|||
<div style={{ color: '#4A4A4A', fontSize: 13 }}> |
|||
22岁 |
|||
</div> |
|||
</div> |
|||
<div style={{ display: 'flex', width: '47.43%' }}> |
|||
<div style={{ color: 'rgba(0, 0, 0,0.6)', fontSize: 12, width: 48, textAlign: 'end' }}> |
|||
籍贯： |
|||
</div> |
|||
<div style={{ color: '#4A4A4A', fontSize: 13 }}> |
|||
镇江 |
|||
</div> |
|||
</div> |
|||
</div> |
|||
<div style={{ display: 'flex', width: '59.18%' }}> |
|||
<div style={{ display: 'flex', width: '53.166%' }}> |
|||
<div style={{ color: 'rgba(0, 0, 0,0.6)', fontSize: 12, width: 60 }}> |
|||
婚育状态： |
|||
</div> |
|||
<div style={{ color: '#4A4A4A', fontSize: 13 }}> |
|||
已婚已育 |
|||
</div> |
|||
</div> |
|||
<div style={{ display: 'flex', width: '46.834%' }}> |
|||
<div style={{ color: 'rgba(0, 0, 0,0.6)', fontSize: 12, width: 60 }}> |
|||
工作地点： |
|||
</div> |
|||
<div style={{ color: '#4A4A4A', fontSize: 13 }}> |
|||
江西-南昌 |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
{/* 学历信息 */} |
|||
<div style={{ width: '40%' }}> |
|||
<div style={{ color: '#4A4A4A', fontSize: 14, fontWeight: 'bold' }}> |
|||
学历信息 |
|||
</div> |
|||
<div style={{ display: 'flex', marginTop: 13 }}> |
|||
<div style={{ display: 'flex', width: '43.05%' }}> |
|||
<div style={{ color: 'rgba(0, 0, 0,0.6)', fontSize: 12, width: 60 }}> |
|||
毕业院校： |
|||
</div> |
|||
<div style={{ color: '#4A4A4A', fontSize: 13 }}> |
|||
江苏大学 |
|||
</div> |
|||
</div> |
|||
<div style={{ display: 'flex', width: '56.95' }}> |
|||
<div style={{ color: 'rgba(0, 0, 0,0.6)', fontSize: 12, width: 60 }}> |
|||
毕业时间： |
|||
</div> |
|||
<div style={{ color: '#4A4A4A', fontSize: 13 }}> |
|||
2022年12月31日 |
|||
</div> |
|||
</div> |
|||
</div> |
|||
<div style={{ display: 'flex', marginTop: 9 }}> |
|||
<div style={{ display: 'flex', width: '43.05%' }}> |
|||
<div style={{ color: 'rgba(0, 0, 0,0.6)', fontSize: 12, width: 60, textAlign: 'end' }}> |
|||
学历： |
|||
</div> |
|||
<div style={{ color: '#005ABD', fontSize: 13 }}> |
|||
本科 |
|||
</div> |
|||
</div> |
|||
<div style={{ display: 'flex', width: '56.95' }}> |
|||
<div style={{ color: 'rgba(0, 0, 0,0.6)', fontSize: 12, width: 60, textAlign: 'end' }}> |
|||
专业： |
|||
</div> |
|||
<div style={{ color: '#4A4A4A', fontSize: 13 }}> |
|||
法学 |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
{/* 职务信息 */} |
|||
<div style={{ marginTop: 20 }}> |
|||
<div style={{ color: '#4A4A4A', fontSize: 14, fontWeight: 'bold' }}> |
|||
职务信息 |
|||
</div> |
|||
<div style={{ marginTop: 13, display: 'flex' }}> |
|||
<div style={{ display: 'flex', width: '14.715%' }}> |
|||
<div style={{ color: 'rgba(0, 0, 0,0.6)', fontSize: 12, width: 60 }}> |
|||
员工编号： |
|||
</div> |
|||
<div style={{ color: '#005ABD', fontSize: 13 }}> |
|||
0001 |
|||
</div> |
|||
</div> |
|||
<div style={{ display: 'flex', width: '85.285%' }}> |
|||
<div style={{ color: 'rgba(0, 0, 0,0.6)', fontSize: 12, width: 60 }}> |
|||
所属部门： |
|||
</div> |
|||
<div style={{ color: '#FFFFFF', fontSize: 12, padding: '0px 4px 1px', background: 'rgba(0,90,189,0.8)' }}> |
|||
行业服务部 |
|||
</div> |
|||
</div> |
|||
</div> |
|||
<div style={{ marginTop: 9, display: 'flex' }}> |
|||
<div style={{ display: 'flex', width: '14.715%' }}> |
|||
<div style={{ color: 'rgba(0, 0, 0,0.6)', fontSize: 12, width: 60 }}> |
|||
员工职位： |
|||
</div> |
|||
<div style={{ color: '#005ABD', fontSize: 13 }}> |
|||
产品经理 |
|||
</div> |
|||
</div> |
|||
<div style={{ display: 'flex', width: '19.072%' }}> |
|||
<div style={{ color: 'rgba(0, 0, 0,0.6)', fontSize: 12, width: 60 }}> |
|||
入职时间： |
|||
</div> |
|||
<div style={{ color: '#4A4A4A', fontSize: 13 }}> |
|||
0001 |
|||
</div> |
|||
</div> |
|||
<div style={{ display: 'flex', width: '21.395%' }}> |
|||
<div style={{ color: 'rgba(0, 0, 0,0.6)', fontSize: 12, width: 84 }}> |
|||
转试用期时间： |
|||
</div> |
|||
<div style={{ color: '#4A4A4A', fontSize: 13 }}> |
|||
2022年12月31日 |
|||
</div> |
|||
</div> |
|||
<div style={{ display: 'flex', width: '' }}> |
|||
<div style={{ color: 'rgba(0, 0, 0,0.6)', fontSize: 12, width: 60 }}> |
|||
转正时间： |
|||
</div> |
|||
<div style={{ color: '#4A4A4A', fontSize: 13 }}> |
|||
2022年12月31日 |
|||
</div> |
|||
</div> |
|||
</div> |
|||
<div style={{ display: 'flex' }}> |
|||
<div style={{ marginTop: 9, display: 'flex', width: '14.715%' }}> |
|||
<div style={{ color: 'rgba(0, 0, 0,0.6)', fontSize: 12, width: 60 }}> |
|||
工作经验： |
|||
</div> |
|||
<div style={{ color: '#005ABD', fontSize: 13 }}> |
|||
10年 |
|||
</div> |
|||
</div> |
|||
<div style={{ marginTop: 9, display: 'flex', width: '19.072%' }}> |
|||
<div style={{ color: 'rgba(0, 0, 0,0.6)', fontSize: 12, width: 60 }}> |
|||
入职年限： |
|||
</div> |
|||
<div style={{ color: '#4A4A4A', fontSize: 13 }}> |
|||
10年 |
|||
</div> |
|||
</div> |
|||
<div style={{ marginTop: 9, display: 'flex', width: '39.4%' }}> |
|||
<div style={{ color: 'rgba(0, 0, 0,0.6)', fontSize: 12, width: 84, textAlign: 'end' }}> |
|||
试用期： |
|||
</div> |
|||
<div style={{ color: '#4A4A4A', fontSize: 13 }}> |
|||
3个月 |
|||
</div> |
|||
</div> |
|||
<div style={{ display: 'flex', width: 139, height: 27, background: '#E5F2FF', borderRadius: 14, cursor: "pointer", alignItems: 'center', justifyContent: 'center' }}> |
|||
<div style={{ width: 18, height: 18 }}> |
|||
<img src="/assets/images/hrImg/resume.png" alt="" style={{ width: '100%', height: '100%' }} /> |
|||
</div> |
|||
<div style={{ marginLeft: 10, fontSize: 13, color: '#4A4A4A' }}> |
|||
他/她的简历 |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
<div style={{ borderRight: '1px solid #DCDEE0', margin: '-16px 0px -20px 0px' }}></div> |
|||
<div style={{ marginLeft: 30, marginTop: 8, paddingRight: 30 }}> |
|||
<div style={{ color: '#4A4A4A', fontSize: 14 }}> |
|||
他/她的历史工作经历与职务 |
|||
</div> |
|||
<div style={{ marginTop: 12, fontSize: 13, display: 'flex', alignItems: 'center' }}> |
|||
<div style={{ width: 4, height: 4, borderRadius: '50%', marginRight: 6, background: '#005ABD' }}></div>2017年就职于XX公司，担任总经理职务 |
|||
</div> |
|||
</div> |
|||
</div> |
|||
<div style={{ borderBottom: '1px solid #DCDEE0', margin: '24px 0px 24px -20px' }}></div> |
|||
<div style={{ paddingLeft: 17 }}> |
|||
<div style={{ color: '#4A4A4A', fontSize: 14, marginBottom: 10 }}> |
|||
基础动作 |
|||
</div> |
|||
<div style={{ color: '#4A4A4A', fontSize: 14, display: 'flex', alignItems: 'center' }}> |
|||
时间筛选：<DatePicker type="dateRange" density="compact" style={{ width: 242 }} /> |
|||
</div> |
|||
<div style={{ display: 'flex', alignItems: 'center', margin: '5px 0px 12px' }}> |
|||
<div style={{ width: 18, height: 18 }}> |
|||
<img src="/assets/images/hrImg/information.png" alt="" style={{ width: '100%', height: '100%' }} /> |
|||
</div> |
|||
<div style={{ marginLeft: 12, color: '#4A4A4A', fontSize: 14 }}> |
|||
加班信息 |
|||
</div> |
|||
</div> |
|||
<div style={{ display: 'flex', width: '100%' }}> |
|||
<div style={{ width: 540, boxShadow: '0px 0px 8px 1px rgba(0,0,0,0.1)', padding: 13 }}> |
|||
<ReactECharts |
|||
option={option} |
|||
notMerge={true} |
|||
lazyUpdate={true} |
|||
theme={"theme_name"} |
|||
/> |
|||
</div> |
|||
<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={{ fontSize: 13, color: '#4A4A4A' }}> |
|||
加班次数： |
|||
</div> |
|||
<div style={{ fontSize: 14, color: '#005ABD', marginLeft: 5 }}> |
|||
25次 |
|||
</div> |
|||
</div> |
|||
<div style={{ display: 'flex', alignItems: 'center', width: '19.124%' }}> |
|||
<div style={{ fontSize: 13, color: '#4A4A4A' }}> |
|||
工作日： |
|||
</div> |
|||
<div style={{ fontSize: 14, color: '#005ABD', marginLeft: 5 }}> |
|||
115小时 |
|||
</div> |
|||
</div> |
|||
<div style={{ display: 'flex', alignItems: 'center', width: '19.87%' }}> |
|||
<div style={{ fontSize: 13, color: '#4A4A4A' }}> |
|||
普通假日： |
|||
</div> |
|||
<div style={{ fontSize: 14, color: '#005ABD', marginLeft: 5 }}> |
|||
12小时 |
|||
</div> |
|||
</div> |
|||
<div style={{ display: 'flex', alignItems: 'center', width: '19.03%' }}> |
|||
<div style={{ fontSize: 13, color: '#4A4A4A' }}> |
|||
法定假日： |
|||
</div> |
|||
<div style={{ fontSize: 14, color: '#005ABD', marginLeft: 5 }}> |
|||
1小时 |
|||
</div> |
|||
</div> |
|||
<div style={{ display: 'flex', alignItems: 'center', width: '19.217%' }}> |
|||
<div style={{ fontSize: 13, color: '#4A4A4A' }}> |
|||
累计加班时长： |
|||
</div> |
|||
<div style={{ fontSize: 14, color: '#005ABD', marginLeft: 5 }}> |
|||
436小时 |
|||
</div> |
|||
</div> |
|||
</div> |
|||
<div> |
|||
<Table |
|||
columns={columns} |
|||
dataSource={tableData} |
|||
bordered={false} |
|||
empty="暂无数据" |
|||
pagination={false} |
|||
scroll={scroll} |
|||
/> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
<div style={{ display: 'flex', alignItems: 'center', margin: '19px 0px 12px' }}> |
|||
<div style={{ width: 18, height: 18 }}> |
|||
<img src="/assets/images/hrImg/information.png" alt="" style={{ width: '100%', height: '100%' }} /> |
|||
</div> |
|||
<div style={{ marginLeft: 12, color: '#4A4A4A', fontSize: 14 }}> |
|||
请假信息 |
|||
</div> |
|||
</div> |
|||
<div style={{ display: 'flex', width: '100%' }}> |
|||
<div style={{ width: 540, boxShadow: '0px 0px 8px 1px rgba(0,0,0,0.1)', padding: 13 }}> |
|||
<ReactECharts |
|||
option={leaveoption} |
|||
notMerge={true} |
|||
lazyUpdate={true} |
|||
theme={"theme_name2"} |
|||
/> |
|||
</div> |
|||
<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={{ fontSize: 13, color: '#4A4A4A' }}> |
|||
请假次数： |
|||
</div> |
|||
<div style={{ fontSize: 14, color: '#005ABD', marginLeft: 5 }}> |
|||
25次 |
|||
</div> |
|||
</div> |
|||
<div style={{ display: 'flex', alignItems: 'center', width: '19.124%' }}> |
|||
<div style={{ fontSize: 13, color: '#4A4A4A' }}> |
|||
年休假： |
|||
</div> |
|||
<div style={{ fontSize: 14, color: '#005ABD', marginLeft: 5 }}> |
|||
115小时 |
|||
</div> |
|||
</div> |
|||
<div style={{ display: 'flex', alignItems: 'center', width: '19.87%' }}> |
|||
<div style={{ fontSize: 13, color: '#4A4A4A' }}> |
|||
事假： |
|||
</div> |
|||
<div style={{ fontSize: 14, color: '#005ABD', marginLeft: 5 }}> |
|||
12小时 |
|||
</div> |
|||
</div> |
|||
<div style={{ display: 'flex', alignItems: 'center', width: '19.03%' }}> |
|||
<div style={{ fontSize: 13, color: '#4A4A4A' }}> |
|||
病假： |
|||
</div> |
|||
<div style={{ fontSize: 14, color: '#005ABD', marginLeft: 5 }}> |
|||
1小时 |
|||
</div> |
|||
</div> |
|||
<div style={{ display: 'flex', alignItems: 'center', width: '19.217%' }}> |
|||
<div style={{ fontSize: 13, color: '#4A4A4A' }}> |
|||
剩余年假： |
|||
</div> |
|||
<div style={{ fontSize: 14, color: '#005ABD', marginLeft: 5 }}> |
|||
436小时 |
|||
</div> |
|||
</div> |
|||
</div> |
|||
<div> |
|||
<Table |
|||
columns={leaveColumns} |
|||
dataSource={leaveData} |
|||
bordered={false} |
|||
empty="暂无数据" |
|||
pagination={false} |
|||
scroll={scroll} |
|||
/> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</> |
|||
) |
|||
} |
|||
|
|||
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); |
|||
@ -0,0 +1,15 @@ |
|||
'use strict'; |
|||
|
|||
import reducers from './reducers'; |
|||
import routes from './routes'; |
|||
import actions from './actions'; |
|||
import { getNavItem } from './nav-item'; |
|||
|
|||
export default { |
|||
key: 'humanAffairs', |
|||
name: '人事管理', |
|||
reducers: reducers, |
|||
routes: routes, |
|||
actions: actions, |
|||
getNavItem: getNavItem |
|||
}; |
|||
@ -0,0 +1,25 @@ |
|||
import React from 'react'; |
|||
import { IconCode } from '@douyinfe/semi-icons'; |
|||
|
|||
export function getNavItem (user, dispatch) { |
|||
return ( |
|||
[ |
|||
{ |
|||
itemKey: 'humanAffairs', |
|||
text: '人事管理', |
|||
icon: <IconCode />, |
|||
items: [ |
|||
{ |
|||
itemKey: 'archivesCenter', |
|||
text: '档案中心', |
|||
icon: <iconpark-icon style={{ width: 20, height: 20 }} name="iconjianshezhong"></iconpark-icon>, |
|||
to: '/humanAffairs/archivesCenter/personnelFiles', |
|||
items: [{ |
|||
itemKey: 'personnelFiles', to: '/humanAffairs/archivesCenter/personnelFiles', text: '人员档案' |
|||
}] |
|||
}, |
|||
] |
|||
}, |
|||
] |
|||
); |
|||
} |
|||
@ -0,0 +1,5 @@ |
|||
'use strict'; |
|||
|
|||
export default { |
|||
|
|||
} |
|||
@ -0,0 +1,30 @@ |
|||
import { PersonnelFiles,PersonnelFilesDetail } from './containers'; |
|||
|
|||
export default [{ |
|||
type: 'inner', |
|||
route: { |
|||
path: '/humanAffairs', |
|||
key: 'humanAffairs', |
|||
breadcrumb: '人事管理', |
|||
// 不设置 component 则面包屑禁止跳转
|
|||
childRoutes: [{ |
|||
path: '/archivesCenter', |
|||
key: 'archivesCenter', |
|||
breadcrumb: '档案中心', |
|||
childRoutes: [{ |
|||
path: '/personnelFiles', |
|||
key: 'personnelFiles', |
|||
component: PersonnelFiles, |
|||
breadcrumb: '人员档案', |
|||
}] |
|||
},] |
|||
} |
|||
},{ |
|||
type: 'inner', |
|||
route: { |
|||
path: "/personnelFilesDetail", |
|||
key: 'personnelFilesDetail', |
|||
breadcrumb: '人员档案详情', |
|||
component: PersonnelFilesDetail |
|||
} |
|||
}]; |
|||
Loading…
Reference in new issue