225 lines
8.6 KiB
TypeScript
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;
|