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

（*）更改个人培训记录文件位置+个人培训记录页面布局

master
Archer_cdm 2 years ago
parent
02e75b9e11
commit
e9c767f7e0
2 changed files with 168 additions and 5 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 3
      web/client/src/sections/humanAffairs/containers/index.js
  2. 170
      web/client/src/sections/humanAffairs/containers/personalTrainRecord.jsx

3
web/client/src/sections/humanAffairs/containers/index.js
View File

@ -13,6 +13,7 @@ import PersonnelDistribution from './salersDistribution/personnelDistribution';
//培训 //培训
import ResourceRepository from './resourceRepository'; import ResourceRepository from './resourceRepository';
import DepartmentTrainRecord from './departmentTrainRecord'; import DepartmentTrainRecord from './departmentTrainRecord';
import PersonalTrainRecord from './personalTrainRecord';
//绩效考核 //绩效考核
import WeeklyManagement from './weeklyManagement'; import WeeklyManagement from './weeklyManagement';
import SaleLog from './saleLog'; import SaleLog from './saleLog';
@ -28,8 +29,6 @@ import EmployeeAuth from './employeeAuth';
import FormMaintenance from './formMaintenance'; import FormMaintenance from './formMaintenance';
//其它 //其它
import PersonnelFilesDetail from './personnelFilesDetail'; import PersonnelFilesDetail from './personnelFilesDetail';
//培训管理
import PersonalTrainRecord from './personalTrainRecord';

170
web/client/src/sections/humanAffairs/containers/personalTrainRecord.jsx
View File

@ -1,10 +1,120 @@
import React, { useEffect, useState } from 'react'; import React, { useEffect, useState, useMemo } from 'react';
import { connect } from 'react-redux'; import { connect } from 'react-redux';
import Empty from '../components/empty'; import { Table, Pagination, Skeleton } from '@douyinfe/semi-ui';
import { SkeletonScreen } from "$components";
import '../style.less' import '../style.less'
const PersonalTrainRecord = (props) => { const PersonalTrainRecord = (props) => {
const { dispatch, actions } = props const { dispatch, actions } = props
const [limits, setLimits] = useState()//每页实际条数
const [query, setQuery] = useState({ limit: 10, page: 0 }); //页码信息
const [tableData, setTableData] = useState([{ id: 1, personalName: '张三', departmentName: '营销第一军团', trainingType: '内部培训', topic: '新员工入职培训', trainer: '李四', trainDate: '2022-12-30 18:30', trainTime: '1小时', trainMethod: '线下', attendanceScore: '95', appraisalMethod: '笔试', appraisalScore: '86', totalScore: '80' }, { id: 2, personalName: '张三', departmentName: '营销第一军团', trainingType: '内部培训', topic: '新员工入职培训', trainer: '李四', trainDate: '2022-12-30 18:30', trainTime: '1小时', trainMethod: '线下', attendanceScore: '95', appraisalMethod: '笔试', appraisalScore: '86', totalScore: '80' }, { id: 3, personalName: '张三', departmentName: '营销第一军团', trainingType: '内部培训', topic: '新员工入职培训', trainer: '李四', trainDate: '2022-12-30 18:30', trainTime: '1小时', trainMethod: '线下', attendanceScore: '95', appraisalMethod: '笔试', appraisalScore: '86', totalScore: '80' }, { id: 4, personalName: '张三', departmentName: '营销第一军团', trainingType: '内部培训', topic: '新员工入职培训', trainer: '李四', trainDate: '2022-12-30 18:30', trainTime: '1小时', trainMethod: '线下', attendanceScore: '95', appraisalMethod: '笔试', appraisalScore: '86', totalScore: '80' }]);
function handleRow(record, index) {// 给偶数行设置斑马纹
if (index % 2 === 0) {
return {
style: {
background: '#FAFCFF',
}
};
} else {
return {};
}
}
const download = () => {
//表头
let head = [];
let headData = { index: '序号', personalName: '姓名', departmentName: '部门', trainingType: '培训类型', topic: '课程主题', trainer: '培训讲师', trainDate: '培训时间', trainTime: '培训时长', trainMethod: '培训方式', attendanceScore: '考勤分数', appraisalMethod: '考核形式', appraisalScore: '考核分数', totalScore: '总分' }
Object.keys(headData).map(key => {
head.push(headData[key]);
})
head = head.join(',') + "\n";
//数据
let templateCsv = "data:text/csv;charset=utf-8,\ufeff" + head;
//创建一个a标签
let link = document.createElement("a");
//为a标签设置属性
link.setAttribute("href", templateCsv);
link.setAttribute("download", "个人培训表单.csv");
//点击a标签
link.click();
}
const columns = [{
title: '序号',
dataIndex: 'id',
key: 'id',
width: 60,
render: (text, record, index) => index + 1
}, {
title: '姓名',
dataIndex: 'personalName',
key: 'personalName',
width: 80
}, {
title: '部门名称',
dataIndex: 'departmentName',
key: 'departmentName',
width: 200
}, {
title: '培训类型',
dataIndex: 'trainingType',
key: 'trainingType',
width: 120
}, {
title: '课程主题',
dataIndex: 'topic',
key: 'topic',
width: 200
}, {
title: '培训讲师',
dataIndex: 'trainer',
key: 'trainer',
width: 100
}, {
title: '培训时间',
dataIndex: 'trainDate',
key: 'trainDate',
width: 200
}, {
title: '培训时长',
dataIndex: 'trainTime',
key: 'trainTime',
width: 100
}, {
title: '培训方式',
dataIndex: 'trainMethod',
key: 'trainMethod',
width: 100
}, {
title: '考勤分数',
dataIndex: 'attendanceScore',
key: 'attendanceScore',
width: 100
}, {
title: '考核形式',
dataIndex: 'appraisalMethod',
key: 'appraisalMethod',
width: 100
}, {
title: '考核分数',
dataIndex: 'appraisalScore',
key: 'appraisalScore',
width: 100
}, {
title: '总分',
dataIndex: 'totalScore',
key: 'totalScore',
width: 100
}, {
title: '操作',
dataIndex: 'action',
width: 120
}];
const scroll = useMemo(() => ({}), []);
return ( return (
<> <>
@ -24,7 +134,61 @@ const PersonalTrainRecord = (props) => {
<div style={{ marginLeft: 6, fontSize: 12, color: '#969799', fontFamily: "DINExp", }}>PERSONAL TRAINING RECORD</div> <div style={{ marginLeft: 6, fontSize: 12, color: '#969799', fontFamily: "DINExp", }}>PERSONAL TRAINING RECORD</div>
</div> </div>
</div> </div>
<Empty />
<div style={{ margin: '18px 0px' }}>
<div style={{ display: 'flex', margin: '16px 0px', justifyContent: 'space-between' }}>
<div style={{ display: 'flex', marginRight: 20 }}>
<div style={{ padding: '6px 20px', background: '#0F7EFB', color: '#FFFFFF', fontSize: 14, cursor: "pointer" }}
// onClick={() => { setImportModalV(true); }}
>
导入
</div>
<div style={{ padding: '6px 20px', background: '#00BA85', color: '#FFFFFF', fontSize: 14, marginLeft: 18, cursor: "pointer" }} onClick={() => download()}>
导入模板下载
</div>
</div>
</div>
<div style={{ marginTop: 20 }}>
<Skeleton
// loading={loading}
loading={false}
active={true}
placeholder={SkeletonScreen()}
>
<Table
columns={columns}
dataSource={tableData}
bordered={false}
empty="暂无数据"
pagination={false}
onRow={handleRow}
scroll={scroll}
/>
</Skeleton>
<div style={{
display: "flex",
justifyContent: "space-between",
padding: "20px 20px",
}}>
<div></div>
<div style={{ display: 'flex', }}>
<span style={{ lineHeight: "30px", fontSize: 13, color: 'rgba(0,90,189,0.8)' }}>
共{limits}条信息
</span>
<Pagination
total={limits}
showSizeChanger
currentPage={query.page + 1}
pageSizeOpts={[10, 20, 30, 40]}
onChange={(currentPage, pageSize) => {
setQuery({ limit: pageSize, page: currentPage - 1 });
page.current = currentPage - 1
}}
/>
</div>
</div>
</div>
</div>
</div> </div>
</div> </div>
</> </>

Write Preview
Loading…
Cancel
Save