From c635d78b479510ebe2556a420948effcd30a0731 Mon Sep 17 00:00:00 2001 From: skyouc Date: 星期六, 21 十二月 2024 18:40:43 +0800 Subject: [PATCH] 新建德森项目分支 --- zy-asrs-flow/src/components/TableSearch/index.jsx | 350 +++++++++++++++++++++++++++++++++++++++++++++++++++------- 1 files changed, 308 insertions(+), 42 deletions(-) diff --git a/zy-asrs-flow/src/components/TableSearch/index.jsx b/zy-asrs-flow/src/components/TableSearch/index.jsx index 8117076..751a4ee 100644 --- a/zy-asrs-flow/src/components/TableSearch/index.jsx +++ b/zy-asrs-flow/src/components/TableSearch/index.jsx @@ -1,42 +1,308 @@ -import React from 'react'; -import { Input, Button, Space } from 'antd'; - -const Filter = (props) => { - return ( - <div style={{ padding: 8 }}> - <Input - style={{ width: 188, marginBottom: 8, display: 'block' }} - value={props.selectedKeys[0]} - onChange={e => { - props.setSelectedKeys(e.target.value ? [e.target.value] : []) - }} - /> - <Space> - <Button - type="primary" - onClick={() => { - props.confirm(); - props.setSearchParam(prevState => ({ - ...prevState, - [props.name]: props.selectedKeys[0] - })); - props.actionRef.current?.reload(); - }} - size="small" - style={{ width: 90 }} - > - 纭畾 - </Button> - <Button - onClick={() => props.clearFilters && props.clearFilters()} - size="small" - style={{ width: 90 }} - > - 閲嶇疆 - </Button> - </Space> - </div> - ); -} - -export default Filter; \ No newline at end of file +import React from 'react'; +import { Input, Button, Space, Select, DatePicker } from 'antd'; +import { FormattedMessage, useIntl } from '@umijs/max'; +import Http from '@/utils/http'; +import moment from 'moment'; + +const NONE_OPTION = -9999; +const DATE_FORMAT = 'YYYY-MM-DD HH:mm:ss'; + +const TextFilter = (props) => { + const intl = useIntl(); + const [condition, setCondition] = React.useState(''); + + return ( + <div style={{ padding: 8 }}> + <Input + style={{ width: 188, marginBottom: 8, display: 'block' }} + placeholder={intl.formatMessage({ id: 'commont.enter', defaultMessage: '璇疯緭鍏�' })} + value={condition} + onChange={e => { + props.setSelectedKeys(e.target.value ? [e.target.value] : []); + setCondition(e.target.value) + }} + /> + <Space> + <Button + type="primary" + onClick={() => { + props.confirm(); + if (condition === '' || condition === null || condition === undefined) { + props.setSearchParam(prevState => { + const state = { ...prevState }; + delete state[props.name]; + return state; + }) + } else { + props.setSearchParam(prevState => ({ + ...prevState, + [props.name]: condition + })); + } + props.actionRef.current?.reload(); + }} + size="small" + style={{ width: 90 }} + > + <FormattedMessage id='common.submit' defaultMessage='纭畾' /> + </Button> + <Button + onClick={() => { + setCondition('') + props.setSelectedKeys([]); + props.clearFilters() + + props.confirm(); + props.setSearchParam(prevState => { + const state = { ...prevState }; + delete state[props.name]; + return state; + }) + props.actionRef.current?.reload(); + }} + size="small" + style={{ width: 90 }} + > + <FormattedMessage id='common.reset' defaultMessage='閲嶇疆' /> + </Button> + </Space> + </div> + ); +} + +const SelectFilter = (props) => { + const intl = useIntl(); + const [currentOption, setCurrentOption] = React.useState(); + + return ( + <div style={{ padding: 8 }}> + <div> + <Select + style={{ width: 188, marginBottom: 8, display: 'block' }} + placeholder={intl.formatMessage({ id: 'commont.select', defaultMessage: '璇烽�夋嫨' })} + value={currentOption === NONE_OPTION ? undefined : currentOption} + onChange={value => { + setCurrentOption(value) + props.setSelectedKeys(value !== undefined && value !== null ? [value] : []); + }} + > + {props.data.map(item => ( + <Select.Option key={item.value} value={item.value}> + {item.label} + </Select.Option> + ))} + </Select> + </div> + <Space> + <Button + type="primary" + onClick={() => { + props.confirm(); + if (currentOption === NONE_OPTION) { + props.setSearchParam(prevState => { + const state = { ...prevState }; + delete state[props.name]; + return state; + }) + } else { + props.setSearchParam(prevState => ({ + ...prevState, + [props.name]: currentOption + })); + } + props.actionRef.current?.reload(); + }} + size="small" + style={{ width: 90 }} + > + <FormattedMessage id='common.submit' defaultMessage='纭畾' /> + </Button> + <Button + onClick={() => { + setCurrentOption(NONE_OPTION) + props.setSelectedKeys([]); + props.clearFilters(); + + props.confirm(); + props.setSearchParam(prevState => { + const state = { ...prevState }; + delete state[props.name]; + return state; + }) + props.actionRef.current?.reload(); + }} + size="small" + style={{ width: 90 }} + > + <FormattedMessage id='common.reset' defaultMessage='閲嶇疆' /> + </Button> + </Space> + </div> + ); +} + +const DatetimeRangeFilter = (props) => { + const intl = useIntl(); + const [dates, setDates] = React.useState([null, null]); + const [startDate, setStartDate] = React.useState(null); + const [endDate, setEndDate] = React.useState(null); + + return ( + <div style={{ padding: 8 }}> + <div> + <Space direction="vertical" size={12}> + <DatePicker.RangePicker + showTime + value={dates} + onChange={changeDates => { + setDates(changeDates); + if (changeDates && changeDates[0] && changeDates[1]) { + const changeStartStr = moment(changeDates[0]).format(DATE_FORMAT); + setStartDate(changeStartStr); + const changeEndStr = moment(changeDates[1]).format(DATE_FORMAT); + setEndDate(changeEndStr); + props.setSelectedKeys([changeStartStr + '-' + changeEndStr]); + } + }} + /> + <Space> + <Button + type="primary" + onClick={() => { + props.confirm(); + if (!dates[0] && !dates[1]) { + props.setSearchParam(prevState => { + const nextState = { ...prevState }; + delete nextState[props.name + 'Range']; + return nextState; + }); + } else { + props.setSearchParam(prevState => ({ + ...prevState, + [props.name + 'Range']: [startDate, endDate] + })); + } + props.actionRef.current?.reload(); + }} + size="small" + > + <FormattedMessage id='common.submit' defaultMessage='纭畾' /> + </Button> + <Button + onClick={() => { + setDates([null, null]); + setStartDate(null); + setEndDate(null); + props.setSelectedKeys([]); + props.clearFilters(); + + props.confirm(); + props.setSearchParam(prevState => { + const nextState = { ...prevState }; + delete nextState[props.name + 'Range']; + return nextState; + }); + props.actionRef.current?.reload(); + }} + size="small" + > + <FormattedMessage id='common.reset' defaultMessage='閲嶇疆' /> + </Button> + </Space> + </Space> + </div> + </div> + ); +} + +const LinkFilter = (props) => { + const intl = useIntl(); + const [currentOption, setCurrentOption] = React.useState(); + const [options, setOptions] = React.useState([]); + + const fetchData = async (value) => { + return await Http.doPostForm(`api/${props.major}/query`, { condition: value }); + } + + async function initOptions(value) { + const { data } = await fetchData(value); + setOptions(data); + } + + React.useEffect(() => { + initOptions() + }, []); + + const handleSearch = (value) => { + initOptions(value) + } + + return ( + <div style={{ padding: 8 }}> + <div> + <Select + style={{ width: 188, marginBottom: 8, display: 'block' }} + placeholder={intl.formatMessage({ id: 'commont.select', defaultMessage: '璇烽�夋嫨' })} + value={currentOption === NONE_OPTION ? undefined : currentOption} + onChange={value => { + setCurrentOption(value) + props.setSelectedKeys(value !== undefined && value !== null ? [value] : []); + }} + onSearch={handleSearch} + options={options.map(item => ({ value: item.value, label: item.label }))} + filterOption={false} + showSearch={true} + > + </Select> + </div> + <Space> + <Button + type="primary" + onClick={() => { + props.confirm(); + if (currentOption === NONE_OPTION) { + props.setSearchParam(prevState => { + const state = { ...prevState }; + delete state[props.name]; + return state; + }) + } else { + props.setSearchParam(prevState => ({ + ...prevState, + [props.name]: currentOption + })); + } + props.actionRef.current?.reload(); + }} + size="small" + style={{ width: 90 }} + > + <FormattedMessage id='common.submit' defaultMessage='纭畾' /> + </Button> + <Button + onClick={() => { + setCurrentOption(NONE_OPTION) + props.setSelectedKeys([]); + props.clearFilters(); + initOptions() + + props.confirm(); + props.setSearchParam(prevState => { + const state = { ...prevState }; + delete state[props.name]; + return state; + }) + props.actionRef.current?.reload(); + }} + size="small" + style={{ width: 90 }} + > + <FormattedMessage id='common.reset' defaultMessage='閲嶇疆' /> + </Button> + </Space> + </div> + ); +} + + +export { TextFilter, SelectFilter, DatetimeRangeFilter, LinkFilter }; \ No newline at end of file -- Gitblit v1.9.1