123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100 |
- import { CloseOutlined } from '@ant-design/icons';
- import { connect, useLocation, useParams } from '@umijs/max';
- import { Button, Tabs } from 'antd';
- import { useEffect, useState } from 'react';
- import MandateDetail from '../components/MandateDetail';
- import styles from './index.less';
- const TaskModal = (props) => {
- const { projectID } = useParams();
- const location = useLocation();
- const queryParams = new URLSearchParams(location.search);
- const mandateIDs =
- queryParams.get('mandate_id')?.split(',').length === 1
- ? queryParams.get('mandate_id')
- : queryParams.get('mandate_id')?.split(',');
- const { userList, dispatch } = props;
- const [modalTitle, setModalTitle] = useState(null);
- const [tabItems, setTabItems] = useState([]);
- const [activeKey, setActiveKey] = useState();
- const onTabChange = (key) => {
- setActiveKey(String(key));
- };
- const closePage = () => {
- // send message to unity close this modal page
- };
- useEffect(() => {
- if (mandateIDs !== undefined) {
- if (Array.isArray(mandateIDs)) {
- setModalTitle(null);
- setTabItems(
- mandateIDs.map((item, index) => {
- return {
- key: String(item),
- label: <span className={styles.fontS24}>任务{index + 1}</span>,
- children: (
- <MandateDetail
- key={item}
- mandateID={item}
- userList={userList}
- projectID={projectID}
- />
- ),
- };
- }),
- );
- } else {
- setModalTitle(<div className={styles.modalTitle}>任务详情</div>);
- }
- }
- }, []);
- useEffect(() => {
- if (userList.length === 0) {
- dispatch({
- type: 'taskUser/fetchUserList',
- payload: { project_id: projectID },
- });
- }
- }, []);
- return (
- <div className={styles.modalContainer}>
- <Button
- className={styles.closeModalBtn}
- type="text"
- icon={<CloseOutlined style={{ fontSize: '24px' }} />}
- onClick={closePage}
- />
- {mandateIDs && Array.isArray(mandateIDs) ? (
- <Tabs
- defaultActiveKey={String(mandateIDs[0])}
- activeKey={activeKey}
- items={tabItems}
- onChange={onTabChange}
- />
- ) : (
- <>
- {modalTitle}
- <MandateDetail
- mandateID={mandateIDs}
- userList={userList}
- projectID={projectID}
- />
- </>
- )}
- </div>
- );
- };
- export default connect(({ taskUser }) => {
- return {
- userList: taskUser.userList,
- };
- })(TaskModal);
|