This commit is contained in:
shixiaohua 2024-04-22 14:47:08 +08:00
parent f0347222c3
commit cae04dfe4f
6 changed files with 123 additions and 192 deletions

View File

@ -144,7 +144,7 @@ export const taskPriorityList: DictType[] = [
code: '1',
name: '不重要紧急',
order: 2,
color: 'gary'
color: 'blue'
}, {
id: 0,
code: '0',

View File

@ -3,33 +3,33 @@ import {Button, Col, Form, Input, Row, Select, Space, theme} from "antd";
import React, {useState} from "react";
import {DownOutlined} from "@ant-design/icons";
import {OperationButtonProps} from "@/app/ui/task/project/OperationButton";
import {Span} from "next/dist/server/lib/trace/tracer";
import CustomSearchForm from "@/app/ui/task/CustomSearchForm";
const AdvancedSearchForm = () => {
const { token } = theme.useToken();
const [form] = Form.useForm();
const [expand, setExpand] = useState(false);
const [searchFields, setSearchFields] = useState<any[]>([
<Form.Item>
<Select
defaultValue="state"
style={{ width: 120 }}
allowClear
options={[{ value: 'state', label: '任务状态' }]}
/>,
<Select
defaultValue="="
style={{ width: 120 }}
allowClear
options={[{ value: '=', label: '等于' },{value:'IN',label:"多个选择"}]}
/>,
<Select
// <Select
// defaultValue="state"
// style={{ width: 120 }}
// allowClear
// options={[{ value: 'state', label: '任务状态' }]}
// />,
// <Select
// defaultValue='='
// style={{ width: 120 }}
// allowClear
// options={[{ value: '=', label: '等于' },{value:'IN',label:"多个选择"}]}
// />,
<Select key='1'
mode="tags"
defaultValue={['8','9']}
style={{ width: 180 }}
allowClear
options={[{ value: '8', label: '新建' },{ value: '9', label: '进行中' },{ value: '7', label: '完成' },]}
/>
</Form.Item>
])
@ -40,7 +40,7 @@ const AdvancedSearchForm = () => {
};
const getFields = () => {
const count = expand ? 10 : 6;
const count = 10;
const children = [];
for (let i = 0; i < count; i++) {
children.push(
@ -86,24 +86,35 @@ const AdvancedSearchForm = () => {
return (
<Form form={form} name="advanced_search" style={formStyle} onFinish={onFinish}>
<Row gutter={24}>{searchFields}</Row>
{/*<Form.Item>*/}
{/*<Row gutter={24}>{searchFields}</Row>*/}
{/* </Form.Item>*/}
{/*<div style={{ textAlign: 'right' }}>*/}
{/* <Space size="small">*/}
<Form.Item>
<Button type="primary">
</Button>
{/*<Form.Item>*/}
{/* <Button type="primary">*/}
{/* 添加*/}
{/* </Button>*/}
{/*<Form.Item>*/}
{searchFields}
<Button type="primary" htmlType="submit">
</Button>
<Button
onClick={() => {
form.resetFields();
}}
>
</Button>
</Form.Item>
{/*<CustomSearchForm/>*/}
{/*</Form.Item>*/}
{/*<Button type="primary" htmlType="submit">*/}
{/* 自定义搜索*/}
{/*</Button>*/}
{/*<Button*/}
{/* onClick={() => {*/}
{/* form.resetFields();*/}
{/* }}*/}
{/*>*/}
{/* 清空*/}
{/*</Button>*/}
{/*</Form.Item>*/}
{/*<a*/}
{/* style={{ fontSize: 12 }}*/}
{/* onClick={() => {*/}

View File

@ -0,0 +1,3 @@
.ant-pro-query-filter.ant-pro-query-filter{
padding: 0;
}

View File

@ -0,0 +1,24 @@
import {
ProFormDatePicker, ProFormSelect,
ProFormText,
QueryFilter,
} from '@ant-design/pro-components';
import '@/app/ui/task/CustomSearchForm.module.css'
import {taskStateList} from "@/app/lib/task/project/data";
const CustomSearchForm= () => {
return (
<QueryFilter defaultCollapsed split style={{paddingTop:0}}>
<ProFormSelect mode="tags" name='state' label='任务状态'
request={async () => taskStateList}/>
{/*</ProFormSelect>*/}
<ProFormText name="name" label="应用名称" />
<ProFormDatePicker name="createDate" label="创建时间" />
<ProFormText name="status" label="应用状态" />
<ProFormDatePicker name="replyDate" label="响应日期" />
<ProFormDatePicker name="startDate" label="创建时间" />
<ProFormDatePicker name="endDate" label="结束时间" />
</QueryFilter>
);
};
export default CustomSearchForm

View File

@ -5,15 +5,14 @@ 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 = () => {
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={() => {
{currentPath.startsWith("/task/project") ? <Button type="primary" onClick={() => {
replace("/task/four");
setCurrentPath("/task/four");
}}></Button> :
@ -21,6 +20,6 @@ export const TitleOperation: React.FC = () => {
replace("/task/project");
setCurrentPath("/task/project")
}}></Button>}
<AdvancedSearchForm/>
<AdvancedSearchForm/>
</div>
}

View File

@ -1,17 +1,17 @@
'use client'
import { EllipsisOutlined, PlusOutlined } 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, Tag } from 'antd';
import React, { useRef } from 'react';
import {EllipsisOutlined, PlusOutlined} 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, Tag} from 'antd';
import React, {useRef} from 'react';
import {DataType} from "@/app/lib/definitions";
import {OPERATION_BUTTON_TYPE, taskPriorityList, taskStateList, taskTreeResult} from "@/app/lib/task/project/data";
import {DetailModelForm} from "@/app/ui/task/project/DetailModelForm";
const columns: ProColumns<DataType>[] = [
{
title: '任务编码',
dataIndex: 'code',
// valueType: 'indexBorder',
width: '10%',
},
{
@ -35,27 +35,46 @@ const columns: ProColumns<DataType>[] = [
dataIndex: 'description',
},
{
disable: true,
title: '任务状态',
dataIndex: 'state',
filters: true,
onFilter: true,
ellipsis: true,
valueType: 'select',
fieldProps:{options:taskStateList.map(item => {return {label: item.name,value: item.code}})},
},
{
disable: true,
title: '优先级',
title: '任务优先级',
dataIndex: 'priority',
valueType: 'select',
fieldProps:{options:taskPriorityList.map(item => {return {label: item.name,value: item.code}})},
fieldProps: {
options: taskPriorityList.map(item => {
return {label: item.name, value: item.code}
})
},
// renderFormItem: (_, { defaultRender }) => {
// return defaultRender(_);
// },
render: (_, record) => (
<Space>
{
<Tag color={taskPriorityList.find(item=> item.code===record.priority?.toString())?.color}
key={taskPriorityList.find(item=> item.code===record.priority?.toString())?.code}>
{taskPriorityList.find(item=> item.code===record.priority?.toString())?.name}
<Tag color={taskPriorityList.find(item => item.code === record.priority?.toString())?.color}
key={taskPriorityList.find(item => item.code === record.priority?.toString())?.code}>
{taskPriorityList.find(item => item.code === record.priority?.toString())?.name}
</Tag>
}
</Space>
),
},
{
title: '任务状态',
dataIndex: 'state',
valueType: 'select',
fieldProps: {
options: taskStateList.map(item => {
return {label: item.name, value: item.code}
})
},
// renderFormItem: (_, { defaultRender }) => {
// return defaultRender(_);
// },
render: (_, record) => (
<Space>
{
<Tag color={taskStateList.find(item => item.code === record.state?.toString())?.color}
key={taskStateList.find(item => item.code === record.state?.toString())?.code}>
{taskStateList.find(item => item.code === record.state?.toString())?.name}
</Tag>
}
</Space>
@ -65,120 +84,39 @@ const columns: ProColumns<DataType>[] = [
title: '期望开始时间',
dataIndex: 'expectedStartTime',
valueType: 'date',
// hideInTable: true,
// search: {
// transform: (value) => {
// return {
// startTime: value,
// };
// },
// },
},
{
title: '期望结束时间',
dataIndex: 'expectedEndTime',
valueType: 'date',
// hideInTable: true,
// search: {
// transform: (value) => {
// return {
// startTime: value,
// };
// },
// },
},
{
title: '实际开始时间',
dataIndex: 'actualStartTime',
valueType: 'date',
// hideInTable: true,
// search: {
// transform: (value) => {
// return {
// startTime: value,
// };
// },
// },
},
{
title: '期望结束时间',
dataIndex: 'actualEndTime',
valueType: 'date',
// hideInTable: true,
// search: {
// transform: (value) => {
// return {
// startTime: value,
// };
// },
// },
},
// {
// title: '创建时间',
// dataIndex: 'created_at',
// valueType: 'dateRange',
// hideInTable: true,
// search: {
// transform: (value) => {
// return {
// startTime: value[0],
// endTime: value[1],
// };
// },
// },
// },
// {
// title: '操作',
// valueType: 'option',
// key: 'option',
// render: (text, record, _, action) => [
// <a
// key="editable"
// onClick={() => {
// action?.startEditable?.(record.id);
// }}
// >
// 编辑
// </a>,
// <a href={record.url} target="_blank" rel="noopener noreferrer" key="view">
// 查看
// </a>,
// <TableDropdown
// key="actionGroup"
// onSelect={() => action?.reload()}
// menus={[
// { key: 'copy', name: '复制' },
// { key: 'delete', name: '删除' },
// ]}
// />,
// ],
// },
];
const TreeTablePro: React.FC = () => {
const actionRef = useRef<ActionType>();
const TreeTablePro: React.FC = () => {
// const actionRef = useRef<ActionType>();
return (
<ProTable<DataType>
columns={columns}
actionRef={actionRef}
// actionRef={actionRef}
cardBordered
request={async (params, sort, filter) => {
console.log(sort, filter);
// await waitTime(2000);
// return axios.post<{
// data: GithubIssueItem[];
// }>('https://proapi.azurewebsites.net/github/issues', {
// params,
// });
console.log('request',params,sort, filter);
const response = await taskTreeResult()
// axios.post('https://proapi.azurewebsites.net/github/issues', {
// params,
// });
return {
data:response.data.content,
data: response.data.content,
success: response.status.success,
}
// return response.data;
}}
editable={{
type: 'multiple',
@ -187,34 +125,13 @@ const TreeTablePro: React.FC = () => {
persistenceKey: 'pro-table-singe-demos',
persistenceType: 'localStorage',
defaultValue: {
option: { fixed: 'right', disable: true },
},
onChange(value) {
console.log('value: ', value);
option: {fixed: 'right', disable: true},
},
// onChange(value) {
// console.log('value: ', value);
// },
}}
rowKey="id"
// search={{
// labelWidth: 'auto',
// }}
search={false}
options={{
setting: {
listsHeight: 400,
},
}}
form={{
// 由于配置了 transform提交的参与与定义的不同这里需要转化一下
syncToUrl: (values, type) => {
if (type === 'get') {
return {
...values,
created_at: [values.startTime, values.endTime],
};
}
return values;
},
}}
pagination={{
pageSize: 5,
onChange: (page) => console.log(page),
@ -223,29 +140,6 @@ const TreeTablePro: React.FC = () => {
headerTitle="任务管理"
toolBarRender={() => [
<DetailModelForm operationId={OPERATION_BUTTON_TYPE.ADD} description='添加主线任务'/>,
// <Dropdown
// key="menu"
// menu={{
// items: [
// {
// label: '1st item',
// key: '1',
// },
// {
// label: '2nd item',
// key: '1',
// },
// {
// label: '3rd item',
// key: '1',
// },
// ],
// }}
// >
// <Button>
// <EllipsisOutlined />
// </Button>
// </Dropdown>,
]}></ProTable>
);
};