110 lines
4.6 KiB
JavaScript
110 lines
4.6 KiB
JavaScript
|
import {Button, Checkbox, DatePicker, Form, Input, Space, Switch, Tag} from "antd-mobile";
|
||
|
|
import ParentTask from "../../components/ParentTask";
|
||
|
|
import React from "react";
|
||
|
|
import dayjs from "dayjs";
|
||
|
|
import {CloseCircleFill} from "antd-mobile-icons";
|
||
|
|
import {useLocation, useNavigate, useOutletContext} from "react-router-dom";
|
||
|
|
const now = new Date()
|
||
|
|
const DetailSearchContext = () => {
|
||
|
|
const {setTitle} = useOutletContext();
|
||
|
|
setTitle("搜索查询")
|
||
|
|
const navigate = useNavigate();
|
||
|
|
const [form] = Form.useForm();
|
||
|
|
const [visible, setVisible] = React.useState(false);
|
||
|
|
const location = useLocation();
|
||
|
|
const search = location.state?.search;
|
||
|
|
console.log("DetailSearchContext.search",search)
|
||
|
|
return (
|
||
|
|
<Form
|
||
|
|
form={form}
|
||
|
|
layout='horizontal'
|
||
|
|
onFinish={(values)=>{
|
||
|
|
navigate("/home/todo", { state: { search: values } })
|
||
|
|
}}
|
||
|
|
footer={
|
||
|
|
<Button block type='submit' color='primary' size='large'>
|
||
|
|
搜索
|
||
|
|
</Button>
|
||
|
|
}
|
||
|
|
>
|
||
|
|
<ParentTask form={form}/>
|
||
|
|
<Form.Item
|
||
|
|
name='name'
|
||
|
|
label='任务信息'
|
||
|
|
>
|
||
|
|
<Input onChange={console.log} placeholder='任务信息'/>
|
||
|
|
</Form.Item>
|
||
|
|
|
||
|
|
<Form.Item name='state' label='任务状态' required>
|
||
|
|
<Checkbox.Group>
|
||
|
|
<Space direction='vertical'>
|
||
|
|
<Checkbox value='8'><Tag color='danger'>未开始</Tag></Checkbox>
|
||
|
|
<Checkbox value='9'><Tag color='warning'>进行中</Tag></Checkbox>
|
||
|
|
<Checkbox value='7'><Tag color='success'>已完成</Tag></Checkbox>
|
||
|
|
<Checkbox value='10'><Tag color='success'>未完成</Tag></Checkbox>
|
||
|
|
<Checkbox value='6'><Tag>已关闭</Tag></Checkbox>
|
||
|
|
</Space>
|
||
|
|
</Checkbox.Group>
|
||
|
|
</Form.Item>
|
||
|
|
<Form.Item name='priority' label='任务优先级'>
|
||
|
|
<Checkbox.Group>
|
||
|
|
<Space direction='vertical'>
|
||
|
|
<Checkbox value='3'><Tag color='danger'>紧急重要</Tag></Checkbox>
|
||
|
|
<Checkbox value='2'><Tag color='warning'>不紧急重要</Tag></Checkbox>
|
||
|
|
<Checkbox value='1'><Tag>紧急不重要</Tag></Checkbox>
|
||
|
|
<Checkbox value='0'><Tag color='success'>不紧急不重要</Tag></Checkbox>
|
||
|
|
</Space>
|
||
|
|
</Checkbox.Group>
|
||
|
|
</Form.Item>
|
||
|
|
<Form.Item noStyle
|
||
|
|
shouldUpdate={(prevValues, curValues) =>
|
||
|
|
prevValues.todoDay !== curValues.todoDay
|
||
|
|
}
|
||
|
|
>
|
||
|
|
{({ getFieldValue, setFieldsValue }) => (
|
||
|
|
<Form.Item
|
||
|
|
name='todoDay'
|
||
|
|
trigger='onConfirm'
|
||
|
|
label='TODO日'
|
||
|
|
help='期望开始时间和期望结束时间包含当日时间段'
|
||
|
|
arrow={
|
||
|
|
getFieldValue('todoDay') ? (
|
||
|
|
<CloseCircleFill
|
||
|
|
style={{
|
||
|
|
color: 'var(--adm-color-light)',
|
||
|
|
fontSize: 14,
|
||
|
|
}}
|
||
|
|
onClick={e => {
|
||
|
|
e.stopPropagation()
|
||
|
|
setFieldsValue({ todoDay: null })
|
||
|
|
}}
|
||
|
|
/>) : true
|
||
|
|
|
||
|
|
}
|
||
|
|
onClick={() => {
|
||
|
|
setVisible(true)
|
||
|
|
}}
|
||
|
|
>
|
||
|
|
<DatePicker
|
||
|
|
visible={visible}
|
||
|
|
onClose={() => {
|
||
|
|
setVisible(false)
|
||
|
|
}}
|
||
|
|
>
|
||
|
|
{value =>
|
||
|
|
value ? dayjs(value).format('YYYY-MM-DD') : '请选择日期'
|
||
|
|
}
|
||
|
|
</DatePicker>
|
||
|
|
</Form.Item>
|
||
|
|
)}
|
||
|
|
</Form.Item>
|
||
|
|
<Form.Item
|
||
|
|
name='delivery'
|
||
|
|
label='延期任务'
|
||
|
|
childElementPosition='right'
|
||
|
|
>
|
||
|
|
<Switch defaultChecked={true}/>
|
||
|
|
</Form.Item>
|
||
|
|
</Form>)
|
||
|
|
}
|
||
|
|
export default DetailSearchContext;
|