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

225 lines
8.6 KiB
TypeScript

import React, {Fragment} from "react";
import {Button, Dropdown, MenuProps, message, Modal, Popconfirm, Radio, Space} from "antd";
import {DownOutlined, QuestionCircleOutlined} from "@ant-design/icons";
import {
commonUpdate,
deleteTask,
OPERATION_BUTTON_TYPE,
taskPriorityList,
} from "@/lib/task/project/data";
import Link from "next/link";
import {DetailModelForm} from "@/ui/task/project/DetailModelForm";
export interface OperationButtonProps {
itemId: string,
itemName:string,
priority?:string,
pid: string,
pPid: string,
operationId?: string,
refreshDate?: () => void,
}
interface OperationModelProps {
operationId: number,
pPid: string,
pid: string,
openModal: boolean,
updatePriority:boolean,
priority?:string,
updatePriorityValue?:string,
}
class OperationButton extends React.Component<OperationButtonProps, OperationModelProps> {
constructor(props: OperationButtonProps) {
super(props);
this.state = {
pid: props.pid,
pPid: props.pPid,
operationId: 0,
openModal: false,
updatePriority:false,
priority: props.priority,
};
}
render() {
const handleCancel = () => {
this.setState({...this.state, openModal: false})
}
const closeAndReloadData = () => {
this.setState({...this.state, openModal: false})
this.props.refreshDate?.()
}
const onClick: MenuProps['onClick'] = ({key}) => {
console.log(key)
};
const priorityHandleOk =async ()=>{
console.log(this.props.itemId,this.state.priority,this.state.updatePriorityValue)
if (this.state.priority==this.state.updatePriorityValue){
return
}
// 修改任务优先级
const res = await commonUpdate({
updateColumnList:[{
name:'priority',
code:'priority',
value:this.state.updatePriorityValue
}],
conditionColumnList:[{
name:'id',
code:'id',
operateType:'=',
value:this.props.itemId
}]
})
// 关闭弹窗
this.setState({updatePriority:false})
if (res.status.success) {
// 全局提示
message.success("完成任务成功")
// 更新任务
this.props.refreshDate?.()
}else {
message.error(res.status.message)
}
}
const items: MenuProps['items'] = [
{
key: OPERATION_BUTTON_TYPE.DETAIL,
label: <a onClick={(e) => {
this.setState({openModal: true, operationId: OPERATION_BUTTON_TYPE.DETAIL})
}}></a>,
},
{
key: OPERATION_BUTTON_TYPE.ADD_CHILD,
label: <a onClick={(e) => {
this.setState({openModal: true, operationId: OPERATION_BUTTON_TYPE.ADD_CHILD})
}}>线</a>,
},
{
key: OPERATION_BUTTON_TYPE.UPDATE,
label: <a onClick={(e) => {
this.setState({openModal: true, operationId: OPERATION_BUTTON_TYPE.UPDATE})
}}></a>,
},
{
key: OPERATION_BUTTON_TYPE.DELETE,
label: <Popconfirm
title="删除任务"
description="确认要删除任务?"
icon={<QuestionCircleOutlined style={{color: 'red'}}/>}
okText="确认"
cancelText="取消"
onConfirm={() => {
deleteTask(this.props.itemId).then((response => {
console.log('response', response)
if (response.status.success) {
message.success("删除任务成功:" + response.data)
this.props.refreshDate?.()
}
}));
}}
><a></a></Popconfirm>,
},
{
key: OPERATION_BUTTON_TYPE.COMPLETE,
label: <Popconfirm
title="完成任务"
description="确认要完成任务?"
okText="确认"
cancelText="取消"
onConfirm={() => {
commonUpdate({
updateColumnList:[{
name:'state',
code:'state',
value:'7'
}],
conditionColumnList:[{
name:'id',
code:'id',
operateType:'=',
value:this.props.itemId
}]
}).then((response => {
console.log('response', response)
if (response.status.success) {
message.success("完成任务成功")
this.props.refreshDate?.()
}
}));
}}
><a></a></Popconfirm>,
},
{
key: OPERATION_BUTTON_TYPE.UPDATE_PRIORITY,
label: <a onClick={(e) => {
this.setState({updatePriority: true})
console.log("修改优先级",this.state.priority)
}}></a>,
},
{
key: OPERATION_BUTTON_TYPE.SHOW_TREE,
label: <Link href={`/task/project?pid=${this.props.itemId}&pName=${this.props.itemName}`}></Link>,
},
{
key: OPERATION_BUTTON_TYPE.SHOW_FOUR,
label: <Link href={`/task/drag?pid=${this.props.itemId}&pName=${this.props.itemName}`}></Link>,
},
{
key: OPERATION_BUTTON_TYPE.SHOW_CALENDAR,
label: <Link href={`/task/calendar?pid=${this.props.itemId}&pName=${this.props.itemName}`}></Link>,
}
];
return <Fragment>
<Dropdown menu={{items, onClick}}>
<a onClick={(e) => {
e.preventDefault()
}}>
<Space>
<DownOutlined/>
</Space>
</a>
</Dropdown>
<Modal
title="修改任务优先级"
open={this.state.updatePriority}
onOk={priorityHandleOk}
onCancel={()=>{this.setState({updatePriority:false})}}
destroyOnClose={true}
okText='确认'
cancelText='取消'
>
<Radio.Group
options={taskPriorityList.map(taskPriority=> {return {
label:taskPriority.name,value:taskPriority.code
}})}
defaultValue={this.state.priority}
optionType="button"
buttonStyle="solid"
onChange={e=>{
console.log({e})
this.setState({updatePriorityValue:e.target.value})
}}
/>
</Modal>
{this.state.openModal&&<DetailModelForm
haveButton={false}
itemId={this.state.operationId === OPERATION_BUTTON_TYPE.UPDATE||this.state.operationId === OPERATION_BUTTON_TYPE.DETAIL?this.props.itemId:undefined}
pPid={this.props.pPid}
pid={this.state.operationId === OPERATION_BUTTON_TYPE.ADD_CHILD ?this.props.itemId:undefined}
operationId={this.state.operationId}
description={this.state.operationId === OPERATION_BUTTON_TYPE.DETAIL ? '任务详情' :
this.state.operationId === OPERATION_BUTTON_TYPE.ADD_CHILD ? '添加支线任务' :
this.state.operationId === OPERATION_BUTTON_TYPE.UPDATE ? '修改任务' : '未知操作'}
open={this.state.openModal}
closeOpen={handleCancel}
reloadData={closeAndReloadData}/>}
</Fragment>
}
}
export default OperationButton;