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

feat:期望开始时间

This commit is contained in:
shixiaohua 2024-04-23 13:19:26 +08:00
parent cae04dfe4f
commit d6087db3f9
10 changed files with 174 additions and 50 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/app/layout.tsx
View File

@ -15,7 +15,7 @@ export default function RootLayout({
}>) {
return (
<html>
<body>{children}</body>
<body style={{margin:0}}>{children}</body>
</html>
);
}

2
src/app/lib/definitions.ts
View File

@ -39,7 +39,7 @@ export type DataType ={
priority: number|string|undefined;
type:number;
action?:React.ReactNode;
expectedStartTime?:Date;
expectedStartTime?:Date|string;
expectedEndTime?:Date;
expectedTimeRange?:(string|Dayjs)[];
actualStartTime?:Date;

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

@ -2,7 +2,8 @@
import SideNav from '@/app/ui/dashboard/sidenav';
import TreeTable from "@/app/ui/task/project/TreeTable";
import '@/app/ui/task/four/index.modules.css'
import {useEffect} from "react";
import {useContext, useEffect} from "react";
import LocalContext from "@/app/ui/LocalContent";
export default function Layout({children}: { children: React.ReactNode }) {
// useEffect(() => {
@ -33,12 +34,30 @@ export default function Layout({children}: { children: React.ReactNode }) {
// @ts-ignore
document.getElementById('tenLeft').style.fontSize = divHeight/6*4 + 'px';
}, []);
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:"="}];
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);
}
return (
<div>
<div className='firstRow' style={{display: 'flex'}}>
<div className='leftUp'>
<TreeTable search={{name:"priority",value:"3",operateType:"="}}/>
<TreeTable search={leftUp}/>
</div>
<div id='tenUp' className='up'>
@ -46,7 +65,7 @@ export default function Layout({children}: { children: React.ReactNode }) {
</div>
<div className='rightUp' >
<TreeTable search={{name:"priority",value:"2",operateType:"="}}/>
<TreeTable search={rightUp}/>
</div>
</div>
<div id='left' className='left'>
@ -54,14 +73,14 @@ export default function Layout({children}: { children: React.ReactNode }) {
</div>
<div className='secondRow' style={{display: 'flex'}}>
<div className='leftDown'>
<TreeTable search={{name:"priority",value:"1",operateType:"="}}/>
<TreeTable search={leftDown}/>
</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={{name:"priority",value:"0",operateType:"="}}/>
<TreeTable search={rightDown}/>
</div>
</div>
</div>

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

@ -1,12 +1,21 @@
'use client'
import React from "react";
import {TitleOperation} from "@/app/ui/task/TitleOperation";
import LocalContext from "../ui/LocalContent";
import dayjs from "dayjs";
export default function Layout({children}: { children: React.ReactNode }) {
const [taskState, setTaskState] = React.useState<string>('8,9')
let expectStartTimeList=[];
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))
return (
<div>
<TitleOperation/>
{children}</div>
<TitleOperation setTaskState={setTaskState} setExpectedStartTime={setExpectedStartTime}/>
<LocalContext.Provider value={{'taskState':taskState,'expectedStartTime':expectedStartTime}}>
{children}
</LocalContext.Provider>
</div>
);
}

12
src/app/task/list/page.tsx Normal file
View File

@ -0,0 +1,12 @@
import TreeTable from "@/app/ui/task/project/TreeTable";
import TreeTablePro from "@/app/ui/task/project/TreeTablePro";
const Page: React.FC = () => {
return (
<>
<TreeTable/>
</>
);
};
export default Page;

5
src/app/ui/LocalContent.tsx Normal file
View File

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

3
src/app/ui/task/TitleOperation.modules.css Normal file
View File

@ -0,0 +1,3 @@
.ant-select-selection-overflow-item-suffix{
visibility: hidden;
}

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

@ -1,25 +1,91 @@
import React from "react";
import {Button} from "antd";
import {Button, DatePicker, Flex, Select, Space} from "antd";
import {usePathname, useRouter} from "next/navigation";
import {DetailFormProps} from "@/app/ui/task/project/DetailForm";
import {DetailModelForm} from "@/app/ui/task/project/DetailModelForm";
import {OPERATION_BUTTON_TYPE} from "@/app/lib/task/project/data";
import AdvancedSearchForm from "@/app/ui/task/AdvancedSearchForm";
import CustomSearchForm from "@/app/ui/task/CustomSearchForm";
// export const TitleOperation: React.FC<DetailFormProps>= () =>
export const TitleOperation: React.FC = () => {
import {OPERATION_BUTTON_TYPE, taskStateList} from "@/app/lib/task/project/data";
import './TitleOperation.modules.css'
import dayjs from "dayjs";
interface TitleOperationProps {
setTaskState: (value: string) => void;
setExpectedStartTime:(value:string)=>void;
}
export const TitleOperation: React.FC<TitleOperationProps> = ({setTaskState,setExpectedStartTime}: TitleOperationProps) => {
const {replace} = useRouter();
const [currentPath, setCurrentPath] = React.useState(usePathname());
return <div style={{display: 'flex'}}>
<DetailModelForm operationId={OPERATION_BUTTON_TYPE.ADD} description='添加主线任务'/>
{currentPath.startsWith("/task/project") ? <Button type="primary" onClick={() => {
replace("/task/four");
setCurrentPath("/task/four");
}}>四象限显示</Button> :
<Button type="primary" onClick={() => {
replace("/task/project");
setCurrentPath("/task/project")
}}>列表显示</Button>}
<AdvancedSearchForm/>
</div>
const {RangePicker} = DatePicker;
return <Space style={{marginTop:0}}>
<DetailModelForm operationId={OPERATION_BUTTON_TYPE.ADD} description='添加主线任务'/>
{currentPath.startsWith("/task/project") ?
<>
<Button type="primary" onClick={() => {
replace("/task/four");
setCurrentPath("/task/four");
}}>四象限显示</Button>
<Button type="primary" onClick={() => {
replace("/task/list");
setCurrentPath("/task/list");
}}>列表展示</Button>
</> :
currentPath.startsWith("/task/list") ?
<>
<Button type="primary" onClick={() => {
replace("/task/project");
setCurrentPath("/task/project")
}}>任务树</Button>
<Button type="primary" onClick={() => {
replace("/task/four");
setCurrentPath("/task/four");
}}>四象限显示</Button>
</> : <>
<Button type="primary" onClick={() => {
replace("/task/project");
setCurrentPath("/task/project");
}}>任务树</Button>
<Button type="primary" onClick={() => {
replace("/task/list");
setCurrentPath("/task/list");
}}>列表展示</Button>
</>
}
{/*<AdvancedSearchForm/>*/}
<span style={{whiteSpace: 'nowrap'}}>任务状态:</span>
<Select
mode="multiple"
allowClear
style={{minWidth: '100px'}}
placeholder="任务状态"
defaultValue={['8', '9']}
onChange={(value) => {
console.log('onChange')
setTaskState(value.join(','))
}}
options={taskStateList.map(item => {
return {label: item.name, value: item.code}
})}
/>
<span style={{whiteSpace: 'nowrap'}}>期望开始时间范围:</span>
<RangePicker
placeholder={['开始时间','结束时间']}
defaultValue={[dayjs().subtract(7,'day'),dayjs().add(7,'day')]}
allowEmpty={[true, true]}
onChange={(dates, dateStrings)=>{
console.log('onChange:',dates,dateStrings);
if(!dates){
setExpectedStartTime('')
return
}
let expectStartTimeList=[];
if (dates[0]) {
expectStartTimeList.push({'name':"expectedStartTime",'value':dates[0],'operateType':">="});
}
if (dates[1]) {
expectStartTimeList.push({'name':"expectedStartTime",'value':dates[1].add(1,'day'),'operateType':"<"})
}
setExpectedStartTime(JSON.stringify(expectStartTimeList))
}}
/>
</Space>
{/*</Flex>*/}
}

8
src/app/ui/task/four/index.modules.css
View File

@ -4,7 +4,7 @@ div{
.leftUp{
width: 49%;
height: 45vh;
background: red;
/*background: red;*/
}
.up{
width: 2%;
@ -14,7 +14,7 @@ div{
.rightUp{
width: 49%;
height: 45vh;
background: yellow;
/*background: yellow;*/
}
.left{
width: 100%;
@ -25,13 +25,13 @@ div{
.leftDown{
width: 49%;
height: 45vh;
background: gray;
/*background: gray;*/
}
.rightDown{
/*float: right;*/
width: 49%;
height: 45vh;
background: green;
/*background: green;*/
}
/*#tenLeft {*/

42
src/app/ui/task/project/TreeTable.tsx
View File

@ -1,12 +1,11 @@
'use client'
import React, {useEffect, useState} from 'react';
import {Button, ColorPicker, Dropdown, MenuProps, Space, Switch, Table} from 'antd';
import {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 {DownOutlined} from "@ant-design/icons";
import {useSearchParams, usePathname, useRouter} from 'next/navigation';
import OperationButton from "@/app/ui/task/project/OperationButton";
import dayjs from "dayjs";
type TableRowSelection<T> = TableProps<T>['rowSelection'];
@ -24,12 +23,12 @@ const columns: TableColumnsType<DataType> = [
key: 'name',
width: '20%',
},
{
title: '任务描述',
dataIndex: 'description',
width: '30%',
key: 'description',
},
// {
// title: '任务描述',
// dataIndex: 'description',
// // width: '30%',
// key: 'description',
// },
{
title: '任务状态',
dataIndex: 'state',
@ -42,6 +41,12 @@ const columns: TableColumnsType<DataType> = [
// width: '10%',
// key: 'priority',
// },
{
title: '期望开始时间',
dataIndex: 'expectedStartTime',
width: '10%',
key: 'expectedStartTime',
},
{
title: '操作',
dataIndex: 'action',
@ -79,23 +84,27 @@ const TreeTable: React.FC<TableSearchType> = (props) => {
<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) {
recursionActionChild(item.children)
} else {
item.children = undefined
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>(10);
const [pageSize, setPageSize] = useState<number>(100);
const refreshDate = (): void => {
getTaskTreeResult(JSON.stringify({
pageSize,
pageNumber,
data: [props.search]
data: props.search
})).then((result: ResponseVO<ResultPage<DataType>>) => {
if (result.status.success) {
recursionActionChild(result.data.content);
@ -105,7 +114,7 @@ const TreeTable: React.FC<TableSearchType> = (props) => {
}
useEffect(() => {
refreshDate();
}, []);
}, [props.search]);
return (
<>
{/*<Space align="center" style={{ marginBottom: 16 }}>*/}
@ -116,6 +125,7 @@ const TreeTable: React.FC<TableSearchType> = (props) => {
columns={columns}
// rowSelection={{ ...rowSelection, checkStrictly}}
dataSource={data}
pagination={{ pageSize: 10 }}
/>
</>
);