108 lines
3.4 KiB
TypeScript
108 lines
3.4 KiB
TypeScript
|
import React, {Fragment} from "react";
|
||
|
import {Button, Dropdown, MenuProps, Modal, Popconfirm, Space} from "antd";
|
||
|
import {DownOutlined, QuestionCircleOutlined} from "@ant-design/icons";
|
||
|
import {DetailForm} from "@/app/ui/task/project/DetailForm";
|
||
|
|
||
|
export interface OperationButtonProps {
|
||
|
itemId: number
|
||
|
}
|
||
|
interface OperationModelProps {
|
||
|
operationId: string,
|
||
|
openModal:boolean
|
||
|
}
|
||
|
class OperationButton extends React.Component<OperationButtonProps,OperationModelProps> {
|
||
|
|
||
|
constructor(props: OperationButtonProps) {
|
||
|
super(props);
|
||
|
this.state = {
|
||
|
operationId: '',
|
||
|
openModal:false
|
||
|
};
|
||
|
}
|
||
|
render() {
|
||
|
const handleCancel =()=>{
|
||
|
this.setState({...this.state,openModal:false})
|
||
|
}
|
||
|
const items: MenuProps['items'] = [
|
||
|
{
|
||
|
key: '1',
|
||
|
label: <a onClick={(e) => {
|
||
|
this.setState({...this.state,openModal:true})
|
||
|
}}>详情</a>,
|
||
|
},
|
||
|
{
|
||
|
key: '2',
|
||
|
label: <a onClick={(e) => {
|
||
|
this.setState({...this.state,openModal:true})
|
||
|
}}>添加下级</a>,
|
||
|
},
|
||
|
{
|
||
|
key: '3',
|
||
|
label: <a onClick={(e) => {
|
||
|
this.setState({...this.state,openModal:true})
|
||
|
}}>修改</a>,
|
||
|
}
|
||
|
,
|
||
|
{
|
||
|
key: '4',
|
||
|
label: <Popconfirm
|
||
|
title="删除任务"
|
||
|
description="确认要删除任务?"
|
||
|
icon={<QuestionCircleOutlined style={{color: 'red'}}/>}
|
||
|
okText="确认"
|
||
|
cancelText="取消"
|
||
|
>删除</Popconfirm>,
|
||
|
}
|
||
|
,
|
||
|
{
|
||
|
key: '5',
|
||
|
label: <Popconfirm
|
||
|
title="完成任务"
|
||
|
description="确认要完成任务?"
|
||
|
okText="确认"
|
||
|
cancelText="取消"
|
||
|
>完成</Popconfirm>,
|
||
|
}
|
||
|
];
|
||
|
return <Fragment>
|
||
|
<Dropdown menu={{items}}>
|
||
|
<a onClick={(e) => {
|
||
|
e.preventDefault()
|
||
|
}}>
|
||
|
<Space>
|
||
|
操作<DownOutlined/>
|
||
|
</Space>
|
||
|
</a>
|
||
|
</Dropdown>
|
||
|
<Modal
|
||
|
open={this.state.openModal}
|
||
|
title="Title"
|
||
|
// open={open}
|
||
|
// onOk={handleOk}
|
||
|
onCancel={handleCancel}
|
||
|
// footer={[
|
||
|
// <Button key="back" onClick={handleCancel}>
|
||
|
// Return
|
||
|
// </Button>,
|
||
|
// <Button key="submit" type="primary" loading={loading} onClick={handleOk}>
|
||
|
// Submit
|
||
|
// </Button>,
|
||
|
// <Button
|
||
|
// key="link"
|
||
|
// href="https://google.com"
|
||
|
// type="primary"
|
||
|
// loading={loading}
|
||
|
// onClick={handleOk}
|
||
|
// >
|
||
|
// Search on Google
|
||
|
// </Button>,
|
||
|
// ]}
|
||
|
>
|
||
|
<DetailForm itemId={this.props.itemId} operationId={'1'}/>
|
||
|
</Modal>
|
||
|
</Fragment>
|
||
|
}
|
||
|
}
|
||
|
|
||
|
export default OperationButton;
|