Browse Source

接口联调

master
deartibers 2 years ago
parent
commit
b009964b76
  1. BIN
      web/client/assets/images/hrImg/upload.png
  2. 4
      web/client/src/index.less
  3. 1988
      web/client/src/sections/humanAffairs/components/city.json
  4. 453
      web/client/src/sections/humanAffairs/components/personnelModal.jsx
  5. 2
      web/client/src/sections/humanAffairs/containers/personnelFiles.jsx

BIN
web/client/assets/images/hrImg/upload.png

Binary file not shown.

After

Width:  |  Height:  |  Size: 523 B

4
web/client/src/index.less

@ -59,10 +59,6 @@ body {
}
}
// SEMI 全局样式
.semi-popover-content {
min-width: 300px
}
.semi-portal-inner {
position: fixed;

1988
web/client/src/sections/humanAffairs/components/city.json

File diff suppressed because it is too large

453
web/client/src/sections/humanAffairs/components/personnelModal.jsx

@ -1,9 +1,11 @@
import React, { useState, useRef, useEffect } from "react";
import { connect } from "react-redux";
import { Modal, Form } from "@douyinfe/semi-ui";
import { Modal, Form, Button, Upload } from "@douyinfe/semi-ui";
import { IconAlertCircle } from '@douyinfe/semi-icons';
import cityData from './city.json';
import PerfectScrollbar from "perfect-scrollbar";
let Scrollbar;
function pushModal (props) {
const {
close,
@ -14,15 +16,29 @@ function pushModal (props) {
actions,
adminEdit,//
editObj,
user
} = props;
const { install } = actions;
const { humanAffairs } = actions;
const form = useRef();//
const [disablePeople, setDisablePeople] = useState(true); //
const [peopleList, setPeopleList] = useState([]); //List
const [departmentId, setDepartmentId] = useState(); //id
const [peopleId, setPeopleId] = useState(); //id
const [peoplePro, setPeoplePro] = useState({}); //
const [usecityData, setUsecityData] = useState(); //id
//
useEffect(() => {
let mycityData = JSON.parse(JSON.stringify(cityData));
for (let i = 0; i < mycityData.length; i++) {
mycityData[i].value = mycityData[i].name
mycityData[i].label = mycityData[i].name
for (let j = 0; j < mycityData[i].children.length; j++) {
mycityData[i].children[j].value = mycityData[i].children[j].name
mycityData[i].children[j].label = mycityData[i].children[j].name
}
}
setUsecityData(mycityData)
// if (editObj.id) {
// let departmentList = []
// for (let i = 0; i < pepList.length; i++) {
@ -37,6 +53,25 @@ function pushModal (props) {
// }
}, []);
useEffect(() => {
const Project = document.getElementById("myForm");
if (Project) {
if (Project && Scrollbar) {
Scrollbar.update();
}
Scrollbar = new PerfectScrollbar("#myForm", {
suppressScrollX: true,
});
}
});
function memberSeach (id) {
dispatch(humanAffairs.getMemberSearch({ keyword: id })).then((res) => {//
if (res.success) {
console.log('res.payload.data', res.payload.data);
setPeoplePro(res.payload.data[0])
}
})
}
function handleOk () {
//
form.current
@ -66,13 +101,14 @@ function pushModal (props) {
onCancel={handleCancel}
>
<div style={{ borderBottom: '1px solid #DCDEE0', margin: '0px -24px' }}></div>
<div style={{ margin: "0px 26px" }}>
<div id="myForm" style={{ margin: "0px 26px", height: 546 }}>
<Form
allowEmpty
labelPosition="left"
labelAlign="right"
labelWidth="98px"
onValueChange={(values, field) => {
console.log('values', values);
// for (var key in field) {
// if (key == 'department') {
// if (values.department >= 0) {
@ -96,8 +132,9 @@ function pushModal (props) {
}}
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 style={{ height: 50, padding: '0px 30px', color: '#4A4A4A', fontWeight: 600, fontSize: 14, display: 'flex', alignItems: 'center' }}>
职务信息
</div>
<div style={{ borderBottom: '1px solid rgba(151,151,151,0.2)', }}></div>
@ -111,62 +148,77 @@ function pushModal (props) {
placeholder="请输入人员编号"
showClear
rules={[{ required: true, message: "请输入人员编号" }]} />
<div style={{ marginLeft: 12, color: '#005ABD', cursor: "pointer", fontSize: 14 }}>
<div style={{ marginLeft: 12, color: '#005ABD', cursor: "pointer", fontSize: 14 }} onClick={() => {
let formList = form.current.getValues()
memberSeach(formList.pepUserId)
}}>
搜索
</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 }}>
职位
{
peoplePro?.name ? (
<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 }}>
{peoplePro.name}
</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 }}>
{peoplePro.pepUserId}
</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 }}>
{peoplePro.role[0]?.name}
</div>
</div>
</div>
<div style={{ color: '#4A4A4A', fontSize: 12 }}>
产品经理
<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>
{
peoplePro.departmrnt?.map((item, index) => {
return (
<div key={index} style={{ color: '#FFFFFF', fontSize: 12, padding: '0px 4px 1px', background: 'rgba(0,90,189,0.8)', marginRight: 4 }}>
{item.name}
</div>
)
})
}
</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 style={{ height: 50, padding: '0px 30px', color: '#4A4A4A', fontSize: 14, fontWeight: 600, display: 'flex', alignItems: 'center' }}>
基本信息
</div>
<div style={{ borderBottom: '1px solid rgba(151,151,151,0.2)', }}></div>
@ -175,7 +227,7 @@ function pushModal (props) {
<div>
<Form.Input
field="idNumber"
label='证件号'
label='证件号:'
style={{ width: 364 }}
initValue={'' || ""}
placeholder="请输入证件号"
@ -183,77 +235,276 @@ function pushModal (props) {
// rules={[{ required: true, message: "" }]}
/>
</div>
<div>
upload
{/* idPhoto */}
<div style={{ height: 32, margin: '12px 0px 12px 40px', display: 'flex', alignItems: 'center' }}>
<div style={{ color: 'rgba(0, 0, 0, 0.65)', fontWeight: 600, width: 98, paddingRight: 16, textAlign: 'end' }}>
上传照片:
</div>
<div>
<Upload action={'_api/attachments/idPhoto?token=' + user.token} limit='1' accept="image/*" maxSize={10240}
onSizeError={(file, fileList) => Toast.error(`${file.name} 超过10M`)}
>
<Button theme='solid' type='primary' style={{ width: 89, borderRadius: 3, height: 32, background: '#005ABD', color: '#FFFFFF' }}>请上传照片</Button>
</Upload>
</div>
</div>
</div>
<div style={{ color: '#1890FF', fontSize: 12, textAlign: 'end' }}>
请上传照片不超过10m支持pngjpgbmp格式
</div>
<div style={{ display: 'flex', alignItems: 'center' }}>
<div>
<Form.Select
label="性别:"
label="性别:"
field="gender"
placeholder="请选择性别"
style={{ width: 122 }}
initValue={departmentId || ""}
showClear
>
<Form.Select.Option value='man'>
<Form.Select.Option value=''>
</Form.Select.Option>
<Form.Select.Option value='woman'>
<Form.Select.Option value=''>
</Form.Select.Option>
</Form.Select>
</div>
<div>
<Form.DatePicker
field="birthday"
label='出生年月:'
placeholder="请选择出生年月"
style={{ width: 184 }}
initValue={new Date()} />
</div>
<div>
<Form.Cascader
placeholder="请选择籍贯"
treeData={usecityData}
field='nativePlace'
label='籍贯:'
showClear
style={{ width: 184 }}
>
</Form.Cascader>
</div>
</div>
<div style={{ display: 'flex', alignItems: 'center' }}>
<div>
<Form.Select
label="政治面貌:"
field="politicsStatus"
placeholder="请选择政治面貌"
style={{ width: 122 }}
initValue={'' || ""}
showClear
>
<Form.Select.Option value='群众'>
群众
</Form.Select.Option>
<Form.Select.Option value='党员'>
党员
</Form.Select.Option>
</Form.Select>
</div>
<div>
<Form.Input
field="phoneNumber"
label='联系方式:'
style={{ width: 184 }}
initValue={'' || ""}
placeholder="请输入联系方式"
showClear
// rules={[{ required: true, message: "" }]}
/>
</div>
<div>
<Form.Cascader
placeholder="工作地点:"
treeData={usecityData}
field='workPlace'
label='工作地点:'
showClear
style={{ width: 184 }}
>
</Form.Cascader>
</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}
{/* 学历信息 */}
<div style={{ width: 846, border: '1px solid rgba(151,151,151,0.2)', marginTop: 12 }}>
<div style={{ height: 50, padding: '0px 30px', color: '#4A4A4A', fontWeight: 600, 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="graduatedFrom"
label='毕业院校:'
style={{ width: 288 }}
initValue={'' || ""}
placeholder="请输入毕业院校"
showClear
// rules={[{ required: true, message: "" }]}
/>
</div>
<div>
<Form.Select
label="学历:"
field="educationBackground"
placeholder="小学/初中/高中/大专/本科/研究生/博士"
style={{ width: 300 }}
initValue={'' || ""}
showClear
>
<Form.Select.Option value='小学'>
小学
</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 value='初中'>
初中
</Form.Select.Option>
)
})
}
</Form.Select>
</div> */}
<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.Option value='博士'>
博士
</Form.Select.Option>
</Form.Select>
</div>
</div>
<div style={{ display: 'flex', alignItems: 'center' }}>
<div>
<Form.Input
field="specialty"
label='专业:'
style={{ width: 288 }}
initValue={'' || ""}
placeholder="请输入专业"
showClear
// rules={[{ required: true, message: "" }]}
/>
</div>
<div>
<Form.DatePicker
field="graduationDate"
label='毕业时间:'
placeholder="请选择毕业时间"
style={{ width: 300 }}
initValue={new Date()} />
</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', fontWeight: 600, 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.DatePicker
field="hiredate"
label='入职时间:'
placeholder="请选择入职时间"
style={{ width: 288 }}
initValue={new Date()} />
</div>
<div>
<Form.DatePicker
field="turnProbationPeriod"
label='转试用期时间:'
placeholder="请选择转试用期时间"
labelWidth="110px"
style={{ width: 288 }}
initValue={new Date()} />
</div>
</div>
<div style={{ color: '#1890FF', fontSize: 12, textAlign: 'end' }}>
*校招未取得毕业证选填
</div>
<div style={{ display: 'flex', alignItems: 'center' }}>
<div>
<Form.DatePicker
field="regularDate"
label='转正时间:'
placeholder="请选择转正时间"
style={{ width: 288 }}
initValue={new Date()} />
</div>
<div>
<Form.DatePicker
field="dimissionDate"
label='离职时间:'
placeholder="请选择离职时间"
style={{ width: 288 }}
labelWidth="110px"
initValue={new Date()} />
</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', fontWeight: 600, 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' }}>
<div>
<div>
<Form.Input
field="experienceYear"
label='工作经验:'
style={{ width: 288 }}
initValue={'' || ""}
placeholder="请输入工作经验,不超过2位数字"
showClear
// rules={[{ required: true, message: "" }]}
/>
</div>
{/* vitae */}
<div style={{ height: 32, width: 386, margin: '12px 0px', display: 'flex', alignItems: 'center' }}>
<div style={{ color: 'rgba(0, 0, 0, 0.65)', fontWeight: 600, width: 98, paddingRight: 16, textAlign: 'end' }}>
上传简历:
</div>
<div style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between', padding: '5px 12px', background: 'rgba(0,90,189,0.07)', width: 288, height: 32, cursor: "pointer" }}>
<div style={{ color: '#005ABD', fontSize: 13 }}>
请上传简历.pdf
</div>
<div style={{ width: 11, height: 11, display: 'flex', alignItems: 'center', }}>
<img src="/assets/images/hrImg/upload.png" alt="" style={{ width: '100%', height: '100%' }} />
</div>
</div>
</div>
</div>
<div>
<Form.TextArea
field="occupationalHistory"
label='工作经历:'
placeholder="请输入工作经历"
style={{ width: 300 }} />
</div>
</div>
</div>
</div>
</Form>
</div>
</Modal>

2
web/client/src/sections/humanAffairs/containers/personnelFiles.jsx

@ -3,7 +3,7 @@ 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 ExportMembersModal from './export-members-modal'
import ExportMembersModal from './import-members-modal'
import '../style.less'
const Rest = (props) => {

Loading…
Cancel
Save