From 07d1135a1913a919679dc23f0a38b9b61987171f Mon Sep 17 00:00:00 2001 From: zhongshujie <2862698242@qq.com> Date: 星期五, 01 八月 2025 15:29:37 +0800 Subject: [PATCH] Merge branch 'master' of http://182.92.203.7:2001/r/OAManage --- src/pages/Welcome.tsx | 810 ++++++++++++++++++++++++++++++++++++++++++++++----------- 1 files changed, 655 insertions(+), 155 deletions(-) diff --git a/src/pages/Welcome.tsx b/src/pages/Welcome.tsx index 5216d7f..b63bcb5 100644 --- a/src/pages/Welcome.tsx +++ b/src/pages/Welcome.tsx @@ -1,164 +1,664 @@ +import { postIdentityLoginLoginOa } from '@/services/WebApi/login'; +import { postOaRoleGetRoleList } from '@/services/WebApi/oaRole'; +import { postOaStaffGetStaffList, postOaStaffNewStaff } from '@/services/WebApi/oaStaff'; +import { DownOutlined } from '@ant-design/icons'; import { PageContainer } from '@ant-design/pro-components'; -import { useModel } from '@umijs/max'; -import { Card, theme } from 'antd'; -import React from 'react'; - -/** - * 姣忎釜鍗曠嫭鐨勫崱鐗囷紝涓轰簡澶嶇敤鏍峰紡鎶芥垚浜嗙粍浠� - * @param param0 - * @returns - */ -const InfoCard: React.FC<{ - title: string; - index: number; - desc: string; - href: string; -}> = ({ title, href, index, desc }) => { - const { useToken } = theme; - - const { token } = useToken(); - - return ( - <div - style={{ - backgroundColor: token.colorBgContainer, - boxShadow: token.boxShadow, - borderRadius: '8px', - fontSize: '14px', - color: token.colorTextSecondary, - lineHeight: '22px', - padding: '16px 19px', - minWidth: '220px', - flex: 1, - }} - > - <div - style={{ - display: 'flex', - gap: '4px', - alignItems: 'center', - }} - > - <div - style={{ - width: 48, - height: 48, - lineHeight: '22px', - backgroundSize: '100%', - textAlign: 'center', - padding: '8px 16px 16px 12px', - color: '#FFF', - fontWeight: 'bold', - backgroundImage: - "url('https://gw.alipayobjects.com/zos/bmw-prod/daaf8d50-8e6d-4251-905d-676a24ddfa12.svg')", - }} - > - {index} - </div> - <div - style={{ - fontSize: '16px', - color: token.colorText, - paddingBottom: 8, - }} - > - {title} - </div> - </div> - <div - style={{ - fontSize: '14px', - color: token.colorTextSecondary, - textAlign: 'justify', - lineHeight: '22px', - marginBottom: 8, - }} - > - {desc} - </div> - <a href={href} target="_blank" rel="noreferrer"> - 浜嗚В鏇村 {'>'} - </a> - </div> - ); -}; - +import { history, useModel } from '@umijs/max'; +import { Button, Col, DatePicker, Divider, Form, Input, Modal, Radio, Row, Select, Space, Tree } from 'antd'; +import TextArea from 'antd/es/input/TextArea'; +import { Router } from 'express'; +import React, { useEffect, useState } from 'react'; +import { flushSync } from 'react-dom'; +import moment from 'moment'; +import { postOaJobLevelGetJobLevelList } from '@/services/WebApi/oaJobLevel'; +import { postOaJobGetJobList } from '@/services/WebApi/oaJob'; +import { postOaDepartmentGetDepartmentList } from '@/services/WebApi/oaDepartment'; +import { postOaJobPositionGetJobPositionList } from '@/services/WebApi/oaJobPosition'; const Welcome: React.FC = () => { - const { token } = theme.useToken(); - const { initialState } = useModel('@@initialState'); + const [treeData, setTreeData] = useState([]); + const [expandedKeys, setExpandedKeys] = useState([]); + const { initialState, setInitialState, refresh } = useModel('@@initialState'); + const [dialogTitle, setDialogTitle] = useState('鏂板缓鐢ㄦ埛'); + const [addDialogVisible, setAddDialogVisible] = useState(false); + const [birthday, setBirthday] = useState("") + const [formRef] = Form.useForm(); + const [currentRoleId, setCurrentRoleId] = useState(''); + const [jobList, setJobList] = useState([]); + const [oaJobLevelList, setOaJobLevelList] = useState([]); + const [deplist, setDepList] = useState([]); + const [jobPositionList, setJobPositionList] = useState([]); + + const getStaffList = async (roleList) => { + const res = await postOaStaffGetStaffList({ start: 0, size: 100, orgId: 5 }); + const staffList = res.datas.map((item: any) => { + return { + key: item.id + 'staff', + title: item.name, + roleId: item.role?.id, + ...item, + }; + }); + for (let i = 0; i < roleList.length; i++) { + const item = roleList[i]; + item.children = staffList.filter((staff) => staff.roleId === item.id); + if (item.children && item.children.length > 0) { + item.children = item.children.map((staff) => { + return { + ...staff, + parent: item, + }; + }); + } + } + console.log(roleList, 'roleList'); + + setTreeData(roleList); + }; + const getRoleList = async () => { + const res = await postOaRoleGetRoleList({ start: 0, size: 100, orgId: 4 }); + if (res && res.datas.length > 0) { + const treeRoles = res.datas.map((item: any) => { + return { + key: item.id, + title: item.name, + children: [], + ...item, + }; + }); + + const keyList = treeRoles.map((item) => item.key); + setExpandedKeys(keyList); + getStaffList(treeRoles); + } + }; + + const selecStaff = (id, parent) => { + postIdentityLoginLoginOa({ staffId: id }).then((res) => { + flushSync(() => { + setInitialState((s: any) => ({ + ...s, + selectRole: parent, + })); + }); + // setInitialState({ + // ...initialState, + // selectRole: parent, + // }); + + refresh(); + history.push('/organizationDesign'); + }); + }; + + const addStaff = (id, parent) => { + setAddDialogVisible(true); + setDialogTitle('鏂板缓鐢ㄦ埛'); + setCurrentRoleId(id); + } + + const MyTreeNode = ({ title, children, id, parent }) => { + return ( + <div style={{ width: '200px', display: 'flex', justifyContent: 'space-between' }}> + <span>{title}</span> + + {children ? ( + <span + onClick={() => { + addStaff(id, parent); + }} + style={{ color: '#1890ff', cursor: 'pointer' }} + > + 鏂板鐢ㄦ埛 + </span> + ) : ( + <span + onClick={() => { + selecStaff(id, parent); + }} + style={{ color: '#1890ff', cursor: 'pointer' }} + > + 鎿嶄綔 + </span> + )} + </div> + ); + }; + + const handleOk = () => { + + formRef.validateFields().then((values) => { + + for (const key in values) { + if (values[key] === undefined) { + values[key] = "" + } + if (values[key] != null && typeof values[key] === 'object') { + values[key] = moment(values[key]).format('YYYY-MM-DD'); + } + } + const params = { + ...values, + sex: "1", + isOnJob: true, + roleId: currentRoleId, + PinYin: "pinyin", + positionSalary: 2, + performanceRates: 2, + performanceSalary: 2, + publicRates: 2, + socialRates: 2, + orgId: 5 + } + + postOaStaffNewStaff(params).then((res) => { + setAddDialogVisible(false); + getRoleList(); + }) + }) + } + const handleCancel = () => { + console.log('OK'); + setAddDialogVisible(false); + } + + const getJobPositionList = async () => { + const res = await postOaJobPositionGetJobPositionList({ start: 0, size: 100, orgId: 5 }); + const options = res.datas.map((item) => { + return { + value: item.id, + label: item.name, + } + }) + setJobPositionList(options); + console.log(res, "getDepList"); + } + const getDepList = async () => { + const res = await postOaDepartmentGetDepartmentList({ start: 0, size: 100, orgId: 5 }); + const options = res.datas.map((item) => { + return { + value: item.id, + label: item.name, + } + }) + setDepList(options); + console.log(res, "getDepList"); + } + const getJobLevelList = async () => { + const res = await postOaJobLevelGetJobLevelList({ start: 0, size: 100, orgId: 5 }); + const options = res.datas.map((item) => { + return { + value: item.id, + label: item.name, + } + }) + setOaJobLevelList(options); + console.log(res, "getJobLevelList"); + } + useEffect(() => { + getRoleList(); + getJobLevelList(); + getJobList(); + getDepList(); + getJobPositionList(); + console.log(initialState, "initialState"); + + }, []); + + + const getJobList = () => { + postOaJobGetJobList({ start: 0, size: 100, orgId: 5 }).then((res) => { + + const options = res.datas.map((item) => { + return { + value: item.id, + label: item.name, + } + }) + setJobList(options); + }) + } return ( <PageContainer> - <Card - style={{ - borderRadius: 8, - }} - styles={{ - body: { - backgroundImage: - initialState?.settings?.navTheme === 'realDark' - ? 'background-image: linear-gradient(75deg, #1A1B1F 0%, #191C1F 100%)' - : 'background-image: linear-gradient(75deg, #FBFDFF 0%, #F5F7FF 100%)', - }, - }} + <div> + <Tree + style={{ width: '300px' }} + titleRender={(nodeData) => <MyTreeNode {...nodeData} />} + defaultExpandAll + expandedKeys={expandedKeys} + showLine + switcherIcon={<DownOutlined />} + treeData={treeData} + /> + </div> + + <Modal + title={dialogTitle} + width={900} + onOk={handleOk} + open={addDialogVisible} + // confirmLoading={confirmLoading} + centered={true} + onCancel={handleCancel} > - <div - style={{ - backgroundPosition: '100% -30%', - backgroundRepeat: 'no-repeat', - backgroundSize: '274px auto', - backgroundImage: - "url('https://gw.alipayobjects.com/mdn/rms_a9745b/afts/img/A*BuFmQqsB2iAAAAAAAAAAAAAAARQnAQ')", - }} - > - <div - style={{ - fontSize: '20px', - color: token.colorTextHeading, - }} - > - 娆㈣繋浣跨敤 Ant Design Pro - </div> - <p - style={{ - fontSize: '14px', - color: token.colorTextSecondary, - lineHeight: '22px', - marginTop: 16, - marginBottom: 32, - width: '65%', - }} - > - Ant Design Pro 鏄竴涓暣鍚堜簡 umi锛孉nt Design 鍜� ProComponents - 鐨勮剼鎵嬫灦鏂规銆傝嚧鍔涗簬鍦ㄨ璁¤鑼冨拰鍩虹缁勪欢鐨勫熀纭�涓婏紝缁х画鍚戜笂鏋勫缓锛屾彁鐐煎嚭鍏稿瀷妯℃澘/涓氬姟缁勪欢/閰嶅璁捐璧勬簮锛岃繘涓�姝ユ彁鍗囦紒涓氱骇涓悗鍙颁骇鍝佽璁$爺鍙戣繃绋嬩腑鐨勩�庣敤鎴枫�忓拰銆庤璁¤�呫�忕殑浣撻獙銆� - </p> - <div - style={{ - display: 'flex', - flexWrap: 'wrap', - gap: 16, - }} - > - <InfoCard - index={1} - href="https://umijs.org/docs/introduce/introduce" - title="浜嗚В umi" - desc="umi 鏄竴涓彲鎵╁睍鐨勪紒涓氱骇鍓嶇搴旂敤妗嗘灦,umi 浠ヨ矾鐢变负鍩虹鐨勶紝鍚屾椂鏀寔閰嶇疆寮忚矾鐢卞拰绾﹀畾寮忚矾鐢憋紝淇濊瘉璺敱鐨勫姛鑳藉畬澶囷紝骞朵互姝よ繘琛屽姛鑳芥墿灞曘��" - /> - <InfoCard - index={2} - title="浜嗚В ant design" - href="https://ant.design" - desc="antd 鏄熀浜� Ant Design 璁捐浣撶郴鐨� React UI 缁勪欢搴擄紝涓昏鐢ㄤ簬鐮斿彂浼佷笟绾т腑鍚庡彴浜у搧銆�" - /> - <InfoCard - index={3} - title="浜嗚В Pro Components" - href="https://procomponents.ant.design" - desc="ProComponents 鏄竴涓熀浜� Ant Design 鍋氫簡鏇撮珮鎶借薄鐨勬ā鏉跨粍浠讹紝浠� 涓�涓粍浠跺氨鏄竴涓〉闈负寮�鍙戠悊蹇碉紝涓轰腑鍚庡彴寮�鍙戝甫鏉ユ洿濂界殑浣撻獙銆�" - /> - </div> + <div style={{ height: '80vh', overflow: 'auto' }}> + <Form form={formRef} layout="vertical" labelCol={{ span: 6 }} wrapperCol={{ span: 18 }}> + <Row> + <Col span={12}> + <Form.Item label="鍛樺伐濮撳悕" name="name" rules={[{ required: true, message: '璇疯緭鍏ュ憳宸ュ鍚�' }]}> + <Input /> + </Form.Item> + </Col> + <Col span={12}> + <Form.Item label="閮ㄩ棬鍚嶇О" name="departmentId"> + <Select + options={deplist} + /> + </Form.Item> + </Col> + </Row> + <Row> + <Col span={12}> + <Form.Item label="韬唤璇佸彿" name="idNum" rules={[{ required: true, message: '璇疯緭鍏ュ憳宸ュ鍚�' }]}> + <Input /> + </Form.Item> + </Col> + <Col span={12}> + <Form.Item label="鎬у埆" name="sex"> + <Select + defaultValue="1" + options={[ + { + value: '0', + label: '濂�', + }, + { + value: '1', + label: '鐢�', + }, + ]} + /> + </Form.Item> + </Col> + </Row> + + <Row> + <Col span={12}> + <Form.Item label="绫嶈疮" name="nativePlace"> + <Input /> + </Form.Item> + </Col> + + <Col span={12}> + <Form.Item label="闆囦剑绫诲瀷" name="employmentType"> + <Select + defaultValue="1" + options={[ + { + value: '0', + label: '鍏艰亴', + }, + { + value: '1', + label: '鍏ㄨ亴', + }, + ]} + /> + </Form.Item> + </Col> + </Row> + <Row> + <Col span={12}> + <Form.Item label="鍑虹敓骞存湀" name="birthday"> + <DatePicker value={birthday} /> + </Form.Item> + </Col> + <Col span={12}> + <Form.Item label="姘戞棌" name="race"> + <Select + defaultValue="1" + options={[ + { + value: '1', + label: '姹夋棌', + }, + { + value: '2', + label: '钘忔棌', + }, + ]} + /> + </Form.Item> + </Col> + </Row> + <Row> + <Col span={12}> + <Form.Item label="濠氬Щ鐘跺喌" name="marriageStatus"> + <Select + defaultValue="1" + options={[ + { + value: '1', + label: '宸插', + }, + { + value: '2', + label: '鏈', + }, + ]} + /> + </Form.Item> + </Col> + <Col span={12}> + <Form.Item label="鏀挎不闈㈣矊" name="politicalStatus"> + <Select + defaultValue="1" + options={[ + { + value: '1', + label: '缇や紬', + }, + { + value: '2', + label: '鍏氬憳', + }, + ]} + /> + </Form.Item> + </Col> + </Row> + <Row> + <Col span={12}> + <Form.Item label="姣曚笟闄㈡牎" name="graduateSchool"> + <Input /> + </Form.Item> + </Col> + + <Col span={12}> + <Form.Item label="涓撲笟" name="major"> + <Input /> + </Form.Item> + </Col> + </Row> + <Row> + <Col span={12}> + <Form.Item label="鑱岀О" name="title"> + <Select + defaultValue="1" + options={[ + { + value: '1', + label: '鏁欐巿', + }, + { + value: '2', + label: '鑰佸笀', + }, + ]} + /> + </Form.Item> + </Col> + + <Col span={12}> + <Form.Item label="宸ョ" name="jobType"> + <Select + defaultValue="1" + options={[ + { + value: '1', + label: '鎶�宸�', + }, + { + value: '2', + label: '宸ョ▼甯�', + }, + ]} + /> + </Form.Item> + </Col> + </Row> + <Row> + <Col span={12}> + <Form.Item label="鏂囧寲绋嬪害" name="educationLevel"> + <Select + defaultValue="1" + options={[ + { + value: '1', + label: '鍒濅腑', + }, + { + value: '2', + label: '楂樹腑', + }, + ]} + /> + </Form.Item> + </Col> + + <Col span={12}> + <Form.Item label="鎵嬫満" name="mobilePhone"> + <Input /> + </Form.Item> + </Col> + </Row> + <Row> + <Col span={12}> + <Form.Item label="鑱旂郴鍦板潃" name="contactAddress"> + <Input /> + </Form.Item> + </Col> + + <Col span={12}> + <Form.Item label="鐢靛瓙閭欢" name="eMail"> + <Input /> + </Form.Item> + </Col> + </Row> + <Row> + <Col span={12}> + <Form.Item label="瀹跺涵浣忓潃" name="homeAddress"> + <Input /> + </Form.Item> + </Col> + + <Col span={12}> + <Form.Item label="鑱旂郴鐢佃瘽" name="phone"> + <Input /> + </Form.Item> + </Col> + </Row> + <Row> + <Col span={24}> + <Form.Item label="澶囨敞" name="remarks"> + <TextArea rows={4} /> + </Form.Item> + </Col> + </Row> + <Divider orientation="left">宀椾綅淇℃伅</Divider> + <Row> + <Col span={12}> + <Form.Item label="宸ュ彿" name="jobNumber"> + <Input /> + </Form.Item> + </Col> + + <Col span={12}> + <Form.Item label="鎵�鍦ㄥ煄甯�" name="city"> + <Select + defaultValue="1" + options={[ + { + value: '1', + label: '涓婃捣', + }, + { + value: '2', + label: '鍖椾含 ', + }, + ]} + /> + </Form.Item> + </Col> + </Row> + <Row> + <Col span={12}> + <Form.Item label="宀椾綅" name="station"> + <Select + options={jobPositionList} + /> + </Form.Item> + </Col> + + <Col span={12}> + <Form.Item label="鏄惁鍦ㄨ亴" name="isOnJob"> + <Radio.Group + options={[ + { value: 1, label: '绂昏亴' }, + { value: 2, label: '鍦ㄨ亴' }, + ]} + /> + </Form.Item> + </Col> + </Row> + <Row> + <Col span={12}> + <Form.Item label="鍏ヨ亴鏃堕棿" name="joinDate"> + <DatePicker format="YYYY-MM-DD" /> + </Form.Item> + </Col> + + <Col span={12}> + <Form.Item label="绂昏亴鏃堕棿" name="offJobDate"> + <DatePicker format="YYYY-MM-DD" /> + </Form.Item> + </Col> + </Row> + <Row> + <Col span={24}> + <Form.Item label="鏄惁閫�浼�" name="isRetire"> + <Radio.Group + options={[ + { value: 1, label: '鍚�' }, + { value: 2, label: '鏄�' }, + ]} + /> + </Form.Item> + </Col> + </Row> + <Row> + <Col span={12}> + <Form.Item label="鍙傚姞宸ヤ綔鏃堕棿" name="beginWorkDate"> + <DatePicker format="YYYY-MM-DD" /> + </Form.Item> + </Col> + + <Col span={12}> + <Form.Item label="甯﹁柂浼戝亣澶╂暟" name="payDayOffs"> + <Input /> + </Form.Item> + </Col> + </Row> + <Row> + <Col span={12}> + <Form.Item label="鑱屼綅" name="jobId"> + <Select + options={jobList} + /> + </Form.Item> + </Col> + + <Col span={12}> + <Form.Item label="鑱岀骇" name="jobPositionId"> + <Select + options={oaJobLevelList} + /> + </Form.Item> + </Col> + </Row> + <Row> + <Col span={12}> + <Form.Item label="鍩烘湰宸ヨ祫" name="name333"> + <Input /> + </Form.Item> + </Col> + + <Col span={12}> + <Form.Item label="鑱岀骇宸ヨ祫" name="positionSalary"> + <Input /> + </Form.Item> + </Col> + </Row> + <Row> + <Col span={12}> + <Form.Item label="缁╂晥绯绘暟" name="performanceRates"> + <Input /> + </Form.Item> + </Col> + + <Col span={12}> + <Form.Item label="缁╂晥宸ヨ祫" name="performanceSalary"> + <Input /> + </Form.Item> + </Col> + </Row> + <Row> + <Col span={12}> + <Form.Item label="绀句繚鍩烘暟" name="socialRates"> + <Input /> + </Form.Item> + </Col> + + <Col span={12}> + <Form.Item label="鍏Н閲戝熀鏁�" name="publicRates"> + <Input /> + </Form.Item> + </Col> + </Row> + <Row> + <Col span={12}> + <Form.Item label="缁╂晥绛夌骇" name="performanceLevel"> + <Select + defaultValue="1" + options={[ + { + value: '1', + label: '1', + }, + ]} + /> + </Form.Item> + </Col> + + <Col span={12}> + <Form.Item label="鏅嬪崌娼滃姏" name="promoteLevel"> + <Select + defaultValue="1" + options={[ + { + value: '1', + label: 'A', + }, + ]} + /> + </Form.Item> + </Col> + </Row> + <Row> + <Col span={12}> + <Form.Item label="绀句繚璐︽埛" name="socialAccount"> + <Input /> + </Form.Item> + </Col> + + <Col span={12}> + <Form.Item label="閾惰璐﹀彿" name="bankAccount"> + <Input /> + </Form.Item> + </Col> + </Row> + </Form> </div> - </Card> + </Modal> </PageContainer> ); }; -- Gitblit v1.9.1