huayu-web
/
assistant-todo
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat:backup

This commit is contained in:
shixiaohua 2024-04-25 16:36:40 +08:00
parent 2b7bb13c83
commit 9d4a0d059b
11 changed files with 433 additions and 321 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

70
src/app/task/four/layout.tsx
View File

@ -1,26 +1,13 @@
'use client'
import SideNav from '@/app/ui/dashboard/sidenav';
import TreeTable from "@/app/ui/task/four/TreeTable";
import '@/app/ui/task/four/index.modules.css'
import {useContext, useEffect} from "react";
import {useContext, useEffect, useState} from "react";
import LocalContext from "@/app/ui/LocalContent";
import {useSearchParams} from "next/dist/client/components/navigation";
import {getTaskTreeResult, taskStateList} from "@/app/lib/task/project/data";
import {DataType, ResponseVO, ResultPage} from "@/app/lib/definitions";
export default function Layout({children}: { children: React.ReactNode }) {
// useEffect(() => {
// // @ts-ignore
// const divWidth = document.getElementById('myDiv').offsetWidth;
// // @ts-ignore
// document.getElementById('mySpan').style.fontSize = divWidth + 'px';
// }, []); // 这里的空数组表示只在组件挂载时执行一次
//
// return (
// <>
// <div id="myDiv" style={{width: '200px'}}>
// Content
// </div>
// <span id="mySpan">Content</span>
// </>
// )
useEffect(() => {
// @ts-ignore
@ -33,31 +20,48 @@ export default function Layout({children}: { children: React.ReactNode }) {
const divHeight = document.getElementById('left').offsetHeight;
// @ts-ignore
document.getElementById('tenLeft').style.fontSize = divHeight/6*4 + 'px';
}, []);
refreshDate()
}, [useContext(LocalContext)]);
const data = useContext(LocalContext);
console.log('data-data.taskState',data.taskState,);
const leftUp = [{name:"priority",value:"3",operateType:"="}];
const rightUp =[{name:"priority",value:"2",operateType:"="}];
const leftDown = [{name:"priority",value:"1",operateType:"="}];
const rightDown = [{name:"priority",value:"0",operateType:"="}];
const leftUp:{name:string,operateType:string,value:string|number|boolean}[] = []
var pid = useSearchParams().get('pid');
// 如果有pid,在前端过滤（防止中间数据不满足条件，导致子数据丢失），
// 无pid在后端过滤（防止数据量过大）。
console.log('data',data);
console.log('pid!=null',pid!=null);
if (pid!=null) {
leftUp.push({name:"pid",value:pid,operateType:"="},{name:'TREE',value:"false",operateType: "TREE"});
}else {
if (data.taskState.length>0){
leftUp.push({name:"state",value:data.taskState,operateType:"IN"});
rightUp.push({name:"state",value:data.taskState,operateType:"IN"});
leftDown.push({name:"state",value:data.taskState,operateType:"IN"});
rightDown.push({name:"state",value:data.taskState,operateType:"IN"});
}
if (data.expectedStartTime.length>0){
const parse = JSON.parse(data.expectedStartTime);
leftUp.push(...parse);
rightUp.push(...parse);
leftDown.push(...parse);
rightDown.push(...parse);
}
}
const [resultDataTypeList, setResultDataTypeList] = useState<DataType[]>([]);
const refreshDate = (): void => {
getTaskTreeResult(JSON.stringify({
pageSize:1000,
pageNumber:1,
data: leftUp
})).then((result: ResponseVO<ResultPage<DataType>>) => {
if (result.status.success) {
// recursionActionChild(result.data.content);
result.data.content.forEach(dataType=>{
dataType.state=taskStateList.find(taskState=>taskState.code===dataType.state+'')?.name
})
setResultDataTypeList(result.data.content)
}
})
}
return (
<div>
<div className='firstRow' style={{display: 'flex'}}>
<div className='leftUp'>
<TreeTable search={leftUp} priority='3'/>
<TreeTable refreshDate={refreshDate} priority='3' resultDataTypeList={resultDataTypeList}/>
</div>
<div id='tenUp' className='up'>
@ -65,7 +69,7 @@ export default function Layout({children}: { children: React.ReactNode }) {
</div>
<div className='rightUp' >
<TreeTable search={rightUp} priority='2'/>
<TreeTable refreshDate={refreshDate} priority='2' resultDataTypeList={resultDataTypeList}/>
</div>
</div>
<div id='left' className='left'>
@ -73,14 +77,14 @@ export default function Layout({children}: { children: React.ReactNode }) {
</div>
<div className='secondRow' style={{display: 'flex'}}>
<div className='leftDown'>
<TreeTable search={leftDown} priority='1'/>
<TreeTable refreshDate={refreshDate} priority='1' resultDataTypeList={resultDataTypeList}/>
</div>
<div className='up'>
<span id='upDown'>向上重要</span>
</div>
{/*<div style={{float:'left',width:'48%',height: '48vh',background:"gray"}}>{children}</div>*/}
<div className='rightDown'>
<TreeTable search={rightDown} priority='0'/>
<TreeTable refreshDate={refreshDate} priority='0' resultDataTypeList={resultDataTypeList}/>
</div>
</div>
</div>

10
src/app/task/layout.tsx
View File

@ -10,10 +10,16 @@ export default function Layout({children}: { children: React.ReactNode }) {
expectStartTimeList.push({'name':"expectedStartTime",'value':dayjs().subtract(7,'day'),'operateType':">="});
expectStartTimeList.push({'name':"expectedStartTime",'value':dayjs().add(7,'day'),'operateType':"<"})
const [expectedStartTime, setExpectedStartTime] = React.useState<string>(JSON.stringify(expectStartTimeList))
const [refreshDataFlag, setRefreshDataFlag] = React.useState<boolean>(true)
function refreshData() {
setRefreshDataFlag(!refreshDataFlag)
}
console.log('taskState,expectedStartTime,refreshDataFlag',taskState,expectedStartTime,refreshDataFlag)
return (
<div>
<TitleOperation setTaskState={setTaskState} setExpectedStartTime={setExpectedStartTime}/>
<LocalContext.Provider value={{'taskState':taskState,'expectedStartTime':expectedStartTime}}>
<LocalContext.Provider value={{'taskState':taskState,'expectedStartTime':expectedStartTime,'refreshData':refreshDataFlag}}>
<TitleOperation setTaskState={setTaskState} setExpectedStartTime={setExpectedStartTime} refreshData={refreshData}/>
{children}
</LocalContext.Provider>
</div>

2
src/app/task/project/page.tsx
View File

@ -1,11 +1,9 @@
import TreeTable from "@/app/ui/task/four/TreeTable";
import TreeTablePro from "@/app/ui/task/project/TreeTablePro";
const Page: React.FC = () => {
return (
<>
<TreeTablePro/>
{/*<TreeTable/>*/}
</>
);
};

2
src/app/ui/LocalContent.tsx
View File

@ -1,5 +1,5 @@
import React from 'react';
const LocalContext = React.createContext({'taskState':'','expectedStartTime':''});
const LocalContext = React.createContext({'taskState':'','expectedStartTime':'','refreshData':true});
export default LocalContext;

7
src/app/ui/task/OperationButton.tsx
View File

@ -10,7 +10,7 @@ export interface OperationButtonProps {
pid: number,
pPid: number,
operationId?: string,
refreshDate?: () => void
refreshDate?: () => void,
}
interface OperationModelProps {
@ -60,8 +60,7 @@ class OperationButton extends React.Component<OperationButtonProps, OperationMod
label: <a onClick={(e) => {
this.setState({openModal: true, operationId: OPERATION_BUTTON_TYPE.UPDATE})
}}>修改任务</a>,
}
,
},
{
key: OPERATION_BUTTON_TYPE.DELETE,
label: <Popconfirm
@ -92,7 +91,7 @@ class OperationButton extends React.Component<OperationButtonProps, OperationMod
},
{
key: OPERATION_BUTTON_TYPE.SHOW_FOUR,
label: <Link href={`/task/four`} >四象限显示子任务</Link>,
label: <Link href={"/task/four?pid=" + this.props.itemId}>四象限显示子任务</Link>,
}
];
return <Fragment>

5
src/app/ui/task/RequestDateType.tsx Normal file
View File

@ -0,0 +1,5 @@
export interface RequestDateType {
name:string,
value:string|number|boolean,
operateType:string
}

37
src/app/ui/task/TitleOperation.tsx
View File

@ -1,36 +1,47 @@
import React from "react";
import React, {useContext} from "react";
import {Button, DatePicker, Flex, Select, Space} from "antd";
import {usePathname, useRouter} from "next/navigation";
import {DetailModelForm} from "@/app/ui/task/project/DetailModelForm";
import {OPERATION_BUTTON_TYPE, taskStateList} from "@/app/lib/task/project/data";
import '@/app/ui/task/TitleOperation.modules.css'
import dayjs from "dayjs";
import LocalContext from "@/app/ui/LocalContent";
import {RequestDateType} from "@/app/ui/task/RequestDateType";
import dayjs, {Dayjs} from "dayjs";
import {element} from "prop-types";
interface TitleOperationProps {
setTaskState: (value: string) => void;
setExpectedStartTime: (value: string) => void;
refreshData: () => void;
}
export const TitleOperation: React.FC<TitleOperationProps> = ({
setTaskState,
setExpectedStartTime
setExpectedStartTime,
refreshData
}: TitleOperationProps) => {
const {replace} = useRouter();
const [currentPath, setCurrentPath] = React.useState(usePathname());
console.log('usePathname()', usePathname());
const data = useContext(LocalContext);
const {RangePicker} = DatePicker;
const expectStartTimeParseResult:RequestDateType[] = data.expectedStartTime.length>0?JSON.parse(data.expectedStartTime):[undefined,undefined]
expectStartTimeParseResult.map(item => item&&item.value ? dayjs(item.value.toString()) : undefined)
const defaultExpectStartTime:[start: Dayjs | null | undefined, end: Dayjs | null | undefined] = [
expectStartTimeParseResult[0]&&expectStartTimeParseResult[0].value ? dayjs(expectStartTimeParseResult[0].value.toString()) : undefined,
expectStartTimeParseResult[1]&&expectStartTimeParseResult[1].value ? dayjs(expectStartTimeParseResult[1].value.toString()) : undefined
];
return <Space style={{marginTop: 0}}>
<DetailModelForm operationId={OPERATION_BUTTON_TYPE.ADD} description='添加主线任务'/>
{currentPath.startsWith("/task/project") ?
<DetailModelForm operationId={OPERATION_BUTTON_TYPE.ADD} description='添加主线任务' reloadData={refreshData}/>
{usePathname().startsWith("/task/project") ?
<>
<Button type="primary" onClick={() => {
replace("/task/four");
setCurrentPath("/task/four");
// setCurrentPath("/task/four");
}}>四象限显示</Button>
</> : <>
<Button type="primary" onClick={() => {
replace("/task/project");
setCurrentPath("/task/project")
// setCurrentPath("/task/project")
}}>任务树</Button>
<span style={{whiteSpace: 'nowrap'}}>任务状态:</span>
<Select
@ -38,7 +49,7 @@ export const TitleOperation: React.FC<TitleOperationProps> = ({
allowClear
style={{minWidth: '100px'}}
placeholder="任务状态"
defaultValue={['8', '9']}
defaultValue={data.taskState.split(",")}
onChange={(value) => {
console.log('onChange')
setTaskState(value.join(','))
@ -50,7 +61,7 @@ export const TitleOperation: React.FC<TitleOperationProps> = ({
<span style={{whiteSpace: 'nowrap'}}>期望开始时间范围:</span>
<RangePicker
placeholder={['开始时间', '结束时间']}
defaultValue={[dayjs().subtract(7, 'day'), dayjs().add(7, 'day')]}
defaultValue={defaultExpectStartTime}
allowEmpty={[true, true]}
onChange={(dates, dateStrings) => {
console.log('onChange:', dates, dateStrings);
@ -65,6 +76,8 @@ export const TitleOperation: React.FC<TitleOperationProps> = ({
'value': dates[0],
'operateType': ">="
});
}else{
expectStartTimeList.push(undefined)
}
if (dates[1]) {
expectStartTimeList.push({
@ -72,6 +85,8 @@ export const TitleOperation: React.FC<TitleOperationProps> = ({
'value': dates[1].add(1, 'day'),
'operateType': "<"
})
}else{
expectStartTimeList.push(undefined)
}
setExpectedStartTime(JSON.stringify(expectStartTimeList))
}}

16
src/app/ui/task/four/DetailForm.tsx
View File

@ -35,7 +35,8 @@ export interface DetailFormProps {
itemId: number,
pPid: number,
operationId: number | undefined,
handleCancel: () => void
handleCancel: () => void,
setUpdatePriority?: (value: (((prevState: (string | undefined)) => (string | undefined)) | string | undefined)) => void
}
export const DetailForm: React.FC<DetailFormProps> = (props) => {
@ -45,7 +46,7 @@ export const DetailForm: React.FC<DetailFormProps> = (props) => {
const {RangePicker} = DatePicker;
const {TextArea} = Input;
// const [taskMessage,setTaskMessage]=useState<any>({name:"useState没效果吗,是这样的"});
// let taskMessage;
let defaultPriority:string|undefined;
useEffect(() => {
if (props.operationId === OPERATION_BUTTON_TYPE.DETAIL || props.operationId === OPERATION_BUTTON_TYPE.UPDATE) {
getTask(props.itemId).then(task => {
@ -54,6 +55,7 @@ export const DetailForm: React.FC<DetailFormProps> = (props) => {
// setTaskMessage(task.data)
task.data.state = taskStateList.find(taskState => taskState.code === task.data.state?.toString())?.name;
task.data.priority = taskPriorityList.find(taskPriority => taskPriority.code === task.data.priority?.toString())?.name;
defaultPriority = task.data.priority
task.data.actualTimeRange = [task.data.actualStartTime ? dayjs(task.data.actualStartTime) : '',
task.data.actualEndTime ? dayjs(task.data.actualEndTime) : ''];
task.data.expectedTimeRange = [task.data.expectedStartTime ? dayjs(task.data.expectedStartTime) : '',
@ -192,14 +194,16 @@ export const DetailForm: React.FC<DetailFormProps> = (props) => {
<Input name='pPid'/>
</Form.Item>
<Form.Item<DataType> name='name' label="任务名称" rules={[{ required: true, message: '任务名称不能为空' }]}>
<Form.Item<DataType> name='name' label="任务名称"
rules={[{required: true, message: '任务名称不能为空'}]}>
<Input name='name'/>
</Form.Item>
<Form.Item<DataType> name='description' label="任务描述">
<TextArea name='description' rows={4}/>
</Form.Item>
<Form.Item<DataType> name='priority' label="任务优先级">
<Select allowClear={true} options={
<Form.Item<DataType> name='priority' initialValue='3' label="任务优先级">
<Select
allowClear={true} options={
taskPriorityList.map(taskState => {
return {
'label': taskState.name,
@ -209,7 +213,7 @@ export const DetailForm: React.FC<DetailFormProps> = (props) => {
}>
</Select>
</Form.Item>
<Form.Item<DataType> name='state' label="任务状态">
<Form.Item<DataType> name='state' initialValue='8' label="任务状态">
<Select allowClear={true} options={
taskStateList.map(taskState => {
return {

186
src/app/ui/task/four/TreeTable.tsx
View File

@ -1,15 +1,41 @@
'use client'
import React, {useEffect, useState} from 'react';
import React, {useContext, useEffect, useState} from 'react';
import {ConfigProvider, Table} from 'antd';
import type {TableColumnsType, TableProps} from 'antd';
import {getTaskTreeResult, taskPriorityList, taskStateList, taskTreeResult} from "@/app/lib/task/project/data";
import {DataType, ResponseVO, ResultPage} from "@/app/lib/definitions";
import OperationButton from "@/app/ui/task/OperationButton";
import dayjs from "dayjs";
import "@/app/ui/task/four/detailForm.modules.css"
import LocalContext from "@/app/ui/LocalContent";
import {useSearchParams} from "next/dist/client/components/navigation";
import {RequestDateType} from "@/app/ui/task/RequestDateType";
type TableRowSelection<T> = TableProps<T>['rowSelection'];
// rowSelection objects indicates the need for row selection
const rowSelection: TableRowSelection<DataType> = {
onChange: (selectedRowKeys, selectedRows) => {
console.log(`selectedRowKeys: ${selectedRowKeys}`, 'selectedRows: ', selectedRows);
},
onSelect: (record, selected, selectedRows) => {
console.log(record, selected, selectedRows);
},
onSelectAll: (selected, selectedRows, changeRows) => {
console.log(selected, selectedRows, changeRows);
},
};
interface TableSearchType {
priority: string,
resultDataTypeList: DataType[],
refreshDate?: () => void
}
const TreeTable: React.FC<TableSearchType> = (props) => {
const dataLocalContext = useContext(LocalContext);
console.log('dataLocalContext', dataLocalContext)
const checkLocal:boolean = useSearchParams().get('pid')!=undefined;
const columns: TableColumnsType<DataType> = [
{
title: '任务编码',
@ -34,18 +60,73 @@ const columns: TableColumnsType<DataType> = [
dataIndex: 'state',
width: '10%',
key: 'state',
filtered: checkLocal&&dataLocalContext.taskState.length > 0,
defaultFilteredValue: dataLocalContext.taskState.split(','),
onFilter: (text, record) => {
// console.log('&record.priority.toString()===props.priority',record.priority,text,props.priority)
// &record.priority.toString()===props.priority 不重要紧急 0 0
if (dataLocalContext.taskState.length === 0) {
return true;
}
var dataLocalContextTaskStateList = dataLocalContext.taskState.split(",");
console.log('dataLocalContextTaskStateList', dataLocalContext.taskState.length > 0, dataLocalContextTaskStateList);
return taskStateList.filter(taskState => dataLocalContextTaskStateList.includes(taskState.code))
.find(taskState => taskState.name === record.state) != undefined;
}
},
{
title: '优先级',
dataIndex: 'priority',
width: '10%',
key: 'priority',
hidden: true,
filters: taskPriorityList.map(taskState => {
return {
'text': taskState.name,
'value': taskState.code
}
}),
filtered: true,
defaultFilteredValue: [props.priority],
onFilter: (text, record) => {
console.log('&record.priority.toString()===props.priority',record.priority,text,props.priority,props.priority === record.priority)
// &record.priority.toString()===props.priority 不重要紧急 0 0
return props.priority === record.priority+''
}
},
// {
// title: '优先级',
// dataIndex: 'priority',
// width: '10%',
// key: 'priority',
// },
{
title: '期望开始时间',
dataIndex: 'expectedStartTime',
width: '10%',
key: 'expectedStartTime',
filtered: checkLocal&&dataLocalContext.expectedStartTime.length > 0,
// defaultFilteredValue: JSON.parse(dataLocalContext.expectedStartTime),
onFilter: (text, record) => {
console.log('dataLocalContext.expectedStartTime',dataLocalContext.expectedStartTime)
if (dataLocalContext.expectedStartTime.length === 0) {
return true;
}
const expectStartTimeParseResult:RequestDateType[] = JSON.parse(dataLocalContext.expectedStartTime);
console.log('expectStartTimeParseResult',expectStartTimeParseResult)
if (expectStartTimeParseResult[0]!=undefined){
let le:boolean;
if (expectStartTimeParseResult[0].operateType==='<='){
le=record.expectedStartTime!=undefined&&record.expectedStartTime<=expectStartTimeParseResult[0].value
}else {
le=record.expectedStartTime!=undefined&&record.expectedStartTime>=expectStartTimeParseResult[0].value
}
if (!le){
return le;
}
}
if(expectStartTimeParseResult[1]!=undefined){
let ge:boolean = record.expectedStartTime!=undefined&&record.expectedStartTime<=expectStartTimeParseResult[1].value
if (!ge){
return ge;
}
}
return true;
}
},
{
title: '操作',
@ -54,68 +135,6 @@ const columns: TableColumnsType<DataType> = [
key: 'action',
},
];
// rowSelection objects indicates the need for row selection
const rowSelection: TableRowSelection<DataType> = {
onChange: (selectedRowKeys, selectedRows) => {
console.log(`selectedRowKeys: ${selectedRowKeys}`, 'selectedRows: ', selectedRows);
},
onSelect: (record, selected, selectedRows) => {
console.log(record, selected, selectedRows);
},
onSelectAll: (selected, selectedRows, changeRows) => {
console.log(selected, selectedRows, changeRows);
},
};
interface TableSearchType {
search?: any
priority:string
}
const TreeTable: React.FC<TableSearchType> = (props) => {
function recursionActionChild(children: DataType[]) {
if (children.length === 0) {
return;
}
for (let item of children) {
item.key = item.id;
item.action = (
<OperationButton itemId={item.id} pid={item.pid} pPid={item.pPid} refreshDate={refreshDate}/>)
item.state = taskStateList.find(taskState => taskState.code === item.state?.toString())?.name;
item.priority = taskPriorityList.find(taskPriority => taskPriority.code === item.priority?.toString())?.name;
if (item.expectedStartTime) {
item.expectedStartTime = dayjs(item.expectedStartTime).format('YYYY-MM-DD HH:mm:ss')
}
if (item.children && item.children.length > 0) {
if (item.children && item.children.length > 0) {
recursionActionChild(item.children)
} else {
item.children = undefined
}
}
}
}
// const [checkStrictly, setCheckStrictly] = useState(false);
const [data, setData] = useState<DataType[]>([]);
const [pageNumber, setPageNumber] = useState<number>(1);
const [pageSize, setPageSize] = useState<number>(100);
const refreshDate = (): void => {
getTaskTreeResult(JSON.stringify({
pageSize,
pageNumber,
data: props.search
})).then((result: ResponseVO<ResultPage<DataType>>) => {
if (result.status.success) {
recursionActionChild(result.data.content);
setData(result.data.content)
}
})
}
useEffect(() => {
refreshDate();
}, [props.search]);
return (
<>
<ConfigProvider
@ -131,7 +150,32 @@ const TreeTable: React.FC<TableSearchType> = (props) => {
<Table
columns={columns}
// rowSelection={{ ...rowSelection, checkStrictly}}
dataSource={data}
dataSource={props.resultDataTypeList.filter(resultDataType=>{
resultDataType.action= <OperationButton itemId={resultDataType.id} pid={resultDataType.pid} pPid={resultDataType.pPid} refreshDate={props.refreshDate}/>
if (dataLocalContext.expectedStartTime.length === 0) {
return true;
}
const expectStartTimeParseResult:RequestDateType[] = JSON.parse(dataLocalContext.expectedStartTime);
if (expectStartTimeParseResult[0]!=undefined){
let le:boolean;
if (expectStartTimeParseResult[0].operateType==='<='){
le=resultDataType.expectedStartTime!=undefined&&resultDataType.expectedStartTime<=expectStartTimeParseResult[0].value
}else {
le=resultDataType.expectedStartTime!=undefined&&resultDataType.expectedStartTime>=expectStartTimeParseResult[0].value
}
if (!le){
return le;
}
}
if(expectStartTimeParseResult[1]!=undefined){
let ge:boolean = resultDataType.expectedStartTime!=undefined&&resultDataType.expectedStartTime<=expectStartTimeParseResult[1].value
if (!ge){
return ge;
}
}
return true;
})}
pagination={{pageSize: 5}}
scroll={{y: 280}}
/>

48
src/app/ui/task/project/DetailModelForm.tsx
View File

@ -2,29 +2,28 @@ import { PlusOutlined } from '@ant-design/icons';
import {
ModalForm,
ProForm,
ProFormDateRangePicker,
ProFormDateRangePicker, ProFormDateTimeRangePicker,
ProFormSelect,
ProFormText, ProFormTextArea, ProFormTreeSelect,
} from '@ant-design/pro-components';
import { Button, Form, message } from 'antd';
import React from "react";
import {getTaskTreeResult, OPERATION_BUTTON_TYPE, taskPriorityList, taskStateList} from "@/app/lib/task/project/data";
import {
addTask,
getTaskTreeResult,
OPERATION_BUTTON_TYPE,
taskPriorityList,
taskStateList
} from "@/app/lib/task/project/data";
import {DataType} from "@/app/lib/definitions";
import {string} from "prop-types";
import dayjs from "dayjs";
const waitTime = (time: number = 100) => {
return new Promise((resolve) => {
setTimeout(() => {
resolve(true);
}, time);
});
};
export type DetailModelFormProps={
itemId?: number,
pPid?:number,
operationId: number,
description:string,
handleCancel?: () => void
reloadData?: () => void
}
export type PidSelectTree= { label: string; value: number; children?: PidSelectTree[] }
export const DetailModelForm: React.FC<DetailModelFormProps> = (props) => {
@ -61,15 +60,24 @@ export const DetailModelForm: React.FC<DetailModelFormProps> = (props) => {
}}
// submitTimeout={2000}
onFinish={async (values) => {
await waitTime(2000);
console.log(values.name);
message.success('提交成功');
addTask(values).then(response => {
console.log('response', response)
if (response.status.success) {
message.success("添加任务成功：" + response.data)
// 树任务重新刷新
// 四象限任务重新刷新
// 如果可以直接更新列表而不请求。。。。。。
console.log('props.reloadData?.()',props.reloadData)
props.reloadData?.()
}
}
)
return true;
}}
>
<ProFormText width="sm" name="id" hidden={true} label="主键" />
<ProFormText width="sm" name="code" hidden={true} label="任务编码" />
<ProFormText width="sm" name="pPid" hidden={true} label="祖宗id" />
<ProFormText width="sm" name="pPid" initialValue={props.pPid} hidden={true} label="祖宗id" />
<ProForm.Group>
<ProFormTreeSelect
width="md"
@ -111,6 +119,7 @@ export const DetailModelForm: React.FC<DetailModelFormProps> = (props) => {
width="sm"
name="priority"
label="任务优先级"
initialValue='3'
disabled ={props.operationId === OPERATION_BUTTON_TYPE.DETAIL}
/>
<ProFormSelect
@ -123,19 +132,24 @@ export const DetailModelForm: React.FC<DetailModelFormProps> = (props) => {
})}
name="state"
label="任务状态"
initialValue='8'
disabled ={props.operationId === OPERATION_BUTTON_TYPE.DETAIL}
/>
</ProForm.Group>
<ProForm.Group>
<ProFormDateRangePicker
<ProFormDateTimeRangePicker
name="expectedTimeRange"
label="期望时间"
fieldProps={{allowEmpty:[true, true],defaultValue:[dayjs(), undefined]}}
placeholder={['开始时间','结束时间']}
disabled ={props.operationId === OPERATION_BUTTON_TYPE.DETAIL}
/>
<ProFormDateRangePicker
<ProFormDateTimeRangePicker
name="actualTimeRange"
label="实际时间"
fieldProps={ {allowEmpty:[true, true]}}
placeholder={['开始时间','结束时间']}
disabled ={props.operationId === OPERATION_BUTTON_TYPE.DETAIL}
/>
</ProForm.Group>

59
src/app/ui/task/project/TreeTablePro.tsx
View File

@ -1,9 +1,16 @@
'use client'
import {CheckSquareFilled, EllipsisOutlined, HeartFilled, HeartOutlined, PlusOutlined} from '@ant-design/icons';
import {
CheckSquareFilled,
EllipsisOutlined,
HeartFilled,
HeartOutlined,
PlusOutlined,
QuestionCircleOutlined
} from '@ant-design/icons';
import type {ActionType, ProColumns} from '@ant-design/pro-components';
import {ProTable, TableDropdown} from '@ant-design/pro-components';
import {Button, Dropdown, Space, Switch, Tag} from 'antd';
import React, {useRef} from 'react';
import {Button, Dropdown, Space, Switch, Tag, Tooltip} from 'antd';
import React, {useContext, useEffect, useRef} from 'react';
import {DataType} from "@/app/lib/definitions";
import {
getTaskTreeResult,
@ -14,7 +21,14 @@ import {
} from "@/app/lib/task/project/data";
import {DetailModelForm} from "@/app/ui/task/project/DetailModelForm";
import OperationButton from "@/app/ui/task/OperationButton";
import LocalContext from "@/app/ui/LocalContent";
const TreeTablePro: React.FC = () => {
const actionRef = useRef<ActionType>();
const [switchChecked, setSwitchChecked] = React.useState(true);
const [filterChecked, setFilterChecked] = React.useState(true);
const columns: ProColumns<DataType>[] = [
{
title: '任务编码',
@ -44,15 +58,17 @@ const columns: ProColumns<DataType>[] = [
{
title: '任务优先级',
dataIndex: 'priority',
order:1,
valueType: 'select',
fieldProps: {
mode:"tags",
options: taskPriorityList.map(item => {
return {label: item.name, value: item.code}
})
},
renderFormItem: (_, { defaultRender }) => {
return defaultRender(_);
},
// renderFormItem: (_, { defaultRender }) => {
// return defaultRender(_);
// },
render: (_, record) => (
<Space>
{
@ -73,6 +89,7 @@ const columns: ProColumns<DataType>[] = [
title: '任务状态',
dataIndex: 'state',
valueType: 'select',
order:2,
initialValue:['8','9'],
fieldProps: {
defaultValue:['8','9'],
@ -119,13 +136,19 @@ const columns: ProColumns<DataType>[] = [
title: '操作',
key: 'option',
valueType: 'option',
render: (_, record) => <OperationButton itemId={record.id} pid={record.pid} pPid={record.pPid} refreshDate={()=>{}}/>,
render: (_, record) => <OperationButton itemId={record.id} pid={record.pid} pPid={record.pPid} refreshDate={actionRef.current?.reload}/>,
}
];
const TreeTablePro: React.FC = () => {
const actionRef = useRef<ActionType>();
const [switchChecked, setSwitchChecked] = React.useState(true);
let toolBarRenderList = [
<DetailModelForm operationId={OPERATION_BUTTON_TYPE.ADD} description='添加主线任务' reloadData={actionRef.current?.reload}/>,
<Switch checkedChildren="树" unCheckedChildren="列表" checked={switchChecked}
onChange={(checked, event) => {setSwitchChecked(checked);actionRef.current?.reset?.();}} />,
];
if (switchChecked){
toolBarRenderList.push(<><span>树子集是否参与过滤</span> <Tooltip title="开启树子集过滤后儿子不满足条件，孙子满足条件，儿子和孙子都不会显示。"><QuestionCircleOutlined /></Tooltip>
<Switch checkedChildren="是" unCheckedChildren="否" checked={filterChecked}
onChange={(checked, event) => {setFilterChecked(checked);actionRef.current?.reload();}} /></>)
}
return (
<ProTable<DataType>
columns={columns}
@ -137,10 +160,13 @@ const TreeTablePro: React.FC = () => {
if (switchChecked) {
searchList.push({name:'pid',value:'0',operateType:"="},{name:'tree',value:'TRUE',operateType:"TREE"})
}
if (params.state){
if (filterChecked) {
searchList.push({name:'tree',value:'TRUE',operateType:"TREE-FILTER"})
}
if (params.state instanceof Array&&params.state.length>0){
searchList.push({name:'state',value:params.state.join(','),operateType:"IN"})
}
if (params.priority){
if (params.priority instanceof Array&&params.state.length>0){
searchList.push({name:'priority',value:params.priority.join(','),operateType:"IN"})
}
if (params.name){
@ -184,11 +210,8 @@ const TreeTablePro: React.FC = () => {
}}
dateFormatter="string"
// headerTitle="任务管理"
toolBarRender={() => [
<DetailModelForm operationId={OPERATION_BUTTON_TYPE.ADD} description='添加主线任务'/>,
<Switch checkedChildren="树" unCheckedChildren="列表" checked={switchChecked}
onChange={(checked, event) => {setSwitchChecked(checked);actionRef.current?.reload();}} />
]}></ProTable>
toolBarRender={()=>toolBarRenderList}>
</ProTable>
);
};
export default TreeTablePro