assistant-todo/src/app/ui/task/project/OperationButton.tsx

108 lines
3.4 KiB
TypeScript
Raw Normal View History

2024-04-12 06:43:55 -04:00
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;