From 6badf8edb38a21620ba7d430273ddf52f82fd68f Mon Sep 17 00:00:00 2001 From: Chengliang <1546584672@qq.com> Date: Mon, 22 Apr 2024 17:52:32 +0800 Subject: [PATCH] =?UTF-8?q?=E5=A4=9A=E8=AF=AD=E8=A8=80=E6=8E=A7=E5=88=B6?= =?UTF-8?q?=E4=BB=A5=E5=8F=8A=E5=A4=96=E9=83=A8=E5=B1=95=E7=A4=BA=E9=83=A8?= =?UTF-8?q?=E9=97=A8=E8=B4=9F=E8=B4=A3=E4=BA=BA?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/drawer/index.jsx | 111 +++++++++++++++++++++++++------- src/components/topBar/index.jsx | 60 ++++++++++------- src/pages/company.jsx | 27 ++++++-- src/pages/user.jsx | 2 +- src/util/i18n.js | 54 ++++++++++++++++ 5 files changed, 197 insertions(+), 57 deletions(-) create mode 100644 src/util/i18n.js diff --git a/src/components/drawer/index.jsx b/src/components/drawer/index.jsx index 0cac1cc..9ce616a 100644 --- a/src/components/drawer/index.jsx +++ b/src/components/drawer/index.jsx @@ -18,6 +18,7 @@ import { message } from 'antd'; import jsPDF from 'jspdf'; import ExportJsonExcel from 'js-export-excel'; import './index.less'; +import { i18n } from '../../util/i18n.js'; let addNodeChildFunc = null; let orgChart = null; @@ -45,6 +46,7 @@ export default class DrawerComponents extends React.Component { // 点击节点 onNodeClick = (node) => { if (node.ftype == '4') { + debugger; this.setState({ jobResponsibility: node.jobResponsibility, isModalOpen: true, @@ -76,6 +78,7 @@ export default class DrawerComponents extends React.Component { //获取数据 getDeatilDatas(params, type = 'chart', showJob = '1') { + const { language } = this.props; this.setState({ spinning: true }); d3.json( '/api/bs/hrmorganization/orgchart/getDepartmentDetail?' + @@ -85,7 +88,49 @@ export default class DrawerComponents extends React.Component { if (type == 'chart') { this.setState({ data: data.data, spinning: false }); } else { - this.setState({ dataSource: data.dataSource, columns: data.columns }); + let columns = [ + { + dataIndex: 'id', + key: 'id', + title: `${i18n.table.no[language]}`, + }, + { + dataIndex: 'workCode', + key: 'workCode', + title: `${i18n.table.workCode[language]}`, + }, + { + dataIndex: 'lastName', + key: 'lastName', + title: `${i18n.table.lastName[language]}`, + }, + { + dataIndex: 'sex', + key: 'sex', + title: `${i18n.table.gender[language]}`, + }, + { + dataIndex: 'departmentName', + key: 'departmentName', + title: `${i18n.table.department[language]}`, + }, + { + dataIndex: 'subcompanyName', + key: 'subcompanyName', + title: `${i18n.table.company[language]}`, + }, + { + dataIndex: 'jobTitle', + key: 'jobTitle', + title: `${i18n.table.possition[language]}`, + }, + { + dataIndex: 'mobile', + key: 'mobile', + title: `${i18n.table.mobile[language]}`, + }, + ]; + this.setState({ dataSource: data.dataSource, columns: columns }); } }); } @@ -177,6 +222,7 @@ export default class DrawerComponents extends React.Component { }; handleExport = (e) => { + const { language } = this.props; let type = e.key == '1' ? 'png' : e.key == '1' ? 'pdf' : 'excel'; if (type == 'png') { orgChart && orgChart.exportImg({ full: true }); @@ -203,7 +249,7 @@ export default class DrawerComponents extends React.Component { } } } - option.fileName = '组织信息'; + option.fileName = `${i18n.table.orgInfo[language]}`; option.datas = [ { sheetData: dataTable, @@ -219,14 +265,14 @@ export default class DrawerComponents extends React.Component { '手机号', ], sheetHeader: [ - '序号', - '工号', - '姓名', - '性别', - '部门', - '分部', - '岗位', - '手机号', + i18n.table.no[language], + i18n.table.workCode[language], + i18n.table.lastName[language], + i18n.table.gender[language], + i18n.table.department[language], + i18n.table.company[language], + i18n.table.possition[language], + i18n.table.mobile[language], ], }, ]; @@ -239,6 +285,8 @@ export default class DrawerComponents extends React.Component { * 节点渲染 */ nodeContentRender = (d, i, arr, state) => { + const { language } = this.props; + if (d.data.ftype == 2) { return `
@@ -260,11 +308,13 @@ export default class DrawerComponents extends React.Component { ${d.data.fname}
- 负责人:${d.data.fleader} + ${i18n.head[language]}:${d.data.fleader}
- 在岗: ${d.data.fonjob} 人 + ${i18n.onJob[language]}: ${d.data.fonjob} ${ + i18n.onJob[language] == 'cn' ? '人' : '' + }
@@ -279,9 +329,13 @@ export default class DrawerComponents extends React.Component {
-
${d.data.fname}
+
${ + d.data.fname + }
- 在岗: ${d.data.fonjob} 人 + ${i18n.onJob[language]}: ${d.data.fonjob} ${ + i18n.onJob[language] == 'cn' ? '人' : '' + }
@@ -307,8 +361,10 @@ export default class DrawerComponents extends React.Component { }
- 司龄: ${d.data.companyWorkYear} 年 -
岗位: ${d.data.jobTitle}
+ ${i18n.serveAge[language]}: ${ + d.data.companyWorkYear + } ${i18n.year[language]} +
${i18n.postion[language]}: ${d.data.jobTitle}
@@ -347,6 +403,8 @@ export default class DrawerComponents extends React.Component { }; render() { + const { language } = this.props; + const { params, open, @@ -362,17 +420,17 @@ export default class DrawerComponents extends React.Component { } = this.state; let arr = []; if (detailType == 'chart') { - arr.push({ label: '导出图片', key: '1' }); + arr.push({ label: `${i18n.exportImage[language]}`, key: '1' }); //arr.push({ label: '导出PDF', key: '2' }); } else { - arr.push({ label: '导出表格', key: '3' }); + arr.push({ label: `${i18n.exportTable[language]}`, key: '3' }); } const menu = ; return ( - 是否显示岗位 + {i18n.showJob[language]} )} - + `共 ${dataSource.length} 条`, + showTotal: (total) => + language == 'cn' + ? `共 ${dataSource.length} 条` + : `${dataSource.length} ${i18n.table.records[language]} ${i18n.table.total[language]}`, }} /> )} this.setState({ isModalOpen: false })} footer={[ @@ -454,7 +515,7 @@ export default class DrawerComponents extends React.Component { key="back" onClick={() => this.setState({ isModalOpen: false })} > - 关闭 + {i18n.close[language]} , , ]} > diff --git a/src/components/topBar/index.jsx b/src/components/topBar/index.jsx index 1eb754f..3e6d76b 100644 --- a/src/components/topBar/index.jsx +++ b/src/components/topBar/index.jsx @@ -24,12 +24,7 @@ import locale from 'antd/lib/date-picker/locale/zh_CN'; import { HomeOutlined, FolderOpenOutlined } from '@ant-design/icons'; moment.locale('zh-cn'); -const defaultLevelOpt = [ - { value: '1', label: '全部' }, - { value: '2', label: '一级' }, - { value: '3', label: '二级' }, - { value: '4', label: '三级' }, -]; +import { i18n } from '../../util/i18n.js'; export class TopBar extends React.Component { constructor(props) { @@ -51,7 +46,8 @@ export class TopBar extends React.Component { open: false, confirmLoading: false, description: '', - levelOpt: defaultLevelOpt, + defaultLevelOpt: [], + levelOpt: [], }; } @@ -200,9 +196,13 @@ export class TopBar extends React.Component { * 虚拟维度部门层级构建 */ buildLevelOpt = (level) => { - let opt = [{ value: '1', label: '全部' }]; + const { language } = this.props; + let opt = [{ value: '1', label: `${i18n.all[language]}` }]; for (let index = 1; index <= level; index++) { - opt.push({ value: `${index + 1}`, label: `${index}级` }); + opt.push({ + value: `${index + 1}`, + label: language == 'cn' ? `${index}级` : `Level ${index}`, + }); } return opt; }; @@ -214,6 +214,17 @@ export class TopBar extends React.Component { }; componentDidMount() { + const { language } = this.props; + const defaultLevelOpt = [ + { value: '1', label: `${i18n.all[language]}` }, + { value: '2', label: language == 'cn' ? '一级' : 'Level 1' }, + { value: '3', label: language == 'cn' ? '二级' : 'Level 2' }, + { value: '4', label: language == 'cn' ? '三级' : 'Level 3' }, + ]; + this.setState({ + levelOpt: defaultLevelOpt, + defaultLevelOpt: defaultLevelOpt, + }); this.getSeatchCondition(this.props.url); } @@ -236,7 +247,7 @@ export class TopBar extends React.Component { onClick={this.handleExportMenuClick.bind(this)} items={[ { - label: '导出图片', + label: `${i18n.exportImage[this.props.language]}`, key: '1', }, // { @@ -248,7 +259,7 @@ export class TopBar extends React.Component { ); render() { - const { disabled, type } = this.props; + const { disabled, type, language } = this.props; const { rootTreeData, open, @@ -257,6 +268,7 @@ export class TopBar extends React.Component { requestData, deptTreeData, levelOpt, + defaultLevelOpt, } = this.state; const { fclass, department } = requestData; @@ -264,7 +276,7 @@ export class TopBar extends React.Component {
- 维度: + {i18n.fclass[language]}: - 显示虚拟组织 + {i18n.virtual[language]} @@ -385,14 +397,14 @@ export class TopBar extends React.Component { )} {fclass != '0' ? ( - 部门根节点: + {i18n.deptRoot[language]}: - 查询 + {i18n.search[language]} - + diff --git a/src/pages/company.jsx b/src/pages/company.jsx index 3a928a9..4627d59 100644 --- a/src/pages/company.jsx +++ b/src/pages/company.jsx @@ -12,6 +12,7 @@ import moment from 'moment'; import qs from 'qs'; import { message, Spin, notification } from 'antd'; import { SmileOutlined } from '@ant-design/icons'; +import { i18n } from '../util/i18n.js'; let active = 'top'; let drawerCom = null; @@ -29,19 +30,26 @@ export default function companyPage() { let addNodeChildFunc = null; const [hasRight, setHasRight] = useState(''); const [timelineId, setTimelineId] = useState(0); + const [language, setLanguage] = useState('cn'); const infoRef = useRef(); useEffect(() => { + infoRef.current = timelineId; + let { hash } = window.location; + let languageValue = hash.match(/language=([^&]+)/i); + let language = 'cn'; + if (languageValue && languageValue.length > 1) { + language = languageValue[1]; + setLanguage(language); + } + notification.open({ - message: '提示', - description: - '组织架构图中编制数和在编数显示初始化需参考文档配置定时任务并执行!!!(编制数默认取本年度最新编制信息,人数统计展示仅限于行政维度)', + message: i18n.tips[language], + description: i18n.tipsContent[language], icon: , }); - }, []); - useEffect(() => { - infoRef.current = timelineId; }, [timelineId]); + const [spinning, setSpinning] = useState(false); // 点击节点 @@ -150,6 +158,7 @@ export default function companyPage() { const nodeContentRender = (d, i, arr, state) => { let fclass = topbar.state.requestData.fclass; let statisticsStyle = fclass == 0 ? 'block' : 'none'; + let headStyle = fclass == 0 ? 'none' : 'block'; if (d.data.ftype == 0) { return `
@@ -200,6 +209,9 @@ export default function companyPage() { ${d.data.staffNum} / ${d.data.onJobNum}
+
+ ${d.data.fleader} +
`; @@ -449,6 +461,7 @@ export default function companyPage() { }} type="company" url="/api/bs/hrmorganization/orgchart/getCondition?fclass=0&type=company&id=0" + language={language} /> handleTopLayoutClick(progressBtn)} @@ -478,7 +491,7 @@ export default function companyPage() { nodeContent={nodeContentRender} /> - (drawerCom = r)} /> + (drawerCom = r)} language={language} /> (operateCom = r)} addFolderNode={addFolderNode} diff --git a/src/pages/user.jsx b/src/pages/user.jsx index 4a7c82d..d13d73e 100644 --- a/src/pages/user.jsx +++ b/src/pages/user.jsx @@ -99,7 +99,7 @@ export default function userPage() { // 获取数据 useEffect(() => { document.cookie = - 'ecology_JSessionid=aaawGLaPO07RO41dNaL5y; JSESSIONID=aaawGLaPO07RO41dNaL5y; languageidweaver=7; Systemlanguid=7; loginuuids=1; loginidweaver=sysadmin; __randcode__=62651c45-391e-4d84-a5a7-9db939559994'; + 'ecology_JSessionid=aaaJufMEQ3m8EecoqOd8y; JSESSIONID=aaaJufMEQ3m8EecoqOd8y; Systemlanguid=7; languageidweaver=7; loginidweaver=sysadmin; loginuuids=1;'; d3.json( '/api/bs/hrmorganization/orgchart/userData?fclass=0&fisvitual=0&root=0&level=3&id=0', ).then((data) => { diff --git a/src/util/i18n.js b/src/util/i18n.js new file mode 100644 index 0000000..97030e5 --- /dev/null +++ b/src/util/i18n.js @@ -0,0 +1,54 @@ +export const i18n = { + fclass: { cn: '维度', en: 'Organizational type' }, + companyRoot: { cn: '分部根节点', en: 'Company' }, + deptRoot: { cn: '部门根节点', en: 'Department' }, + level: { cn: '部门层级', en: 'Hierarchy' }, + search: { cn: '查询', en: 'Search' }, + export: { cn: '导出', en: 'Export' }, + exportImage: { cn: '导出图片', en: ' Export Image' }, + exportTable: { cn: '导出表格', en: ' Export Table' }, + hideDept: { cn: '隐藏部门', en: 'Hide Department' }, + virtual: { cn: '显示虚拟组织', en: 'View Virtual Organization' }, + detailInfo: { cn: '详细信息', en: 'Detailed Information' }, + head: { cn: '负责人', en: 'Head' }, + onJob: { cn: '在岗', en: 'HeadCount' }, + serveAge: { cn: '司龄', en: 'Serving Age' }, + year: { cn: '年', en: 'Year' }, + postion: { cn: '岗位', en: 'Position' }, + postionInfo: { cn: '岗位职责', en: 'Job Responsibilities' }, + close: { cn: '关闭', en: 'Close' }, + employeeInfo: { cn: '人员详情', en: 'Employee Information' }, + placeholder: { cn: '请选择', en: 'Please Select' }, + all: { cn: '全部', en: 'All' }, + showJob: { cn: '是否显示岗位', en: 'Is Show Job' }, + + tips: { cn: '提示', en: 'Tips' }, + tipsContent: { + cn: '组织架构图中编制数和在编数显示初始化需参考文档配置定时任务并执行!!!(编制数默认取本年度最新编制信息,人数统计展示仅限于行政维度)', + en: 'The number of entries and the number of entries displayed in the organizational diagram Initialize the scheduled task and execute it. (The compilation number is the latest compilation information of this year by default, and the display of the number of people is limited to the administrative dimension)', + }, + tipsDept: { + cn: '提示:开启后将只显示分部组织架构!!!', + en: 'Tip: Only the branch organization structure will be displayed after it is turned on!!!', + }, + tipsVirtual: { + cn: '提示:若启用虚拟组织,需要在分部自定义表增加字段(名称 fblx) 字段类型 下拉框(0实体 1虚拟) 部门自定义表同上(字段名称 bmlx)。', + en: 'Tip: If virtual organization is enabled, you need to add a field (name fblx) Field type drop-down box (0 entity 1 Virtual) to the department custom table as above (field name bmlx).', + }, + + /** 表头 */ + table: { + no: { cn: '序号', en: 'No' }, + workCode: { cn: '工号', en: 'WorkCode' }, + lastName: { cn: '姓名', en: 'LastName' }, + gender: { cn: '性别', en: 'Gender' }, + department: { cn: '部门', en: 'Department' }, + company: { cn: '分部', en: 'Company' }, + possition: { cn: '岗位', en: 'Possition ' }, + mobile: { cn: '手机号', en: 'Mobile Phone Number ' }, + + orgInfo: { cn: '组织信息', en: 'Organization Information' }, + total: { cn: '共', en: 'in total' }, + records: { cn: '条', en: 'records' }, + }, +};