RoleFilter.tsx
2.51 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
import React from 'react';
import { debounce } from 'lodash';
import { Row, Input, Radio, Col, Select } from "antd";
import { useStore } from '../index';
import { RoleTypeEnum, UseTypeEnum } from '../entity';
const Search = Input.Search;
const RadioButton = Radio.Button;
const RadioGroup = Radio.Group;
const Option = Select.Option;
export default function RoleFilter() {
const { setParams, systems, innerParams } = useStore();
const fetchListByName = debounce(value => {
setParams({ ...innerParams, roleName: value, current: 1 }, true);
}, 500);
return (
<Row justify="start" style={{ flexWrap: "wrap", flex: 1 }}>
<RadioGroup defaultValue={undefined} style={{ width: 200, marginRight: 10, marginBottom: 10 }} onChange={e => setParams({ ...innerParams, status: e.target.value, current: 1 }, true)}>
<RadioButton value={undefined}>全部</RadioButton>
<RadioButton value={1}>启用</RadioButton>
<RadioButton value={0}>禁用</RadioButton>
{/* <RadioButton value={-1}>已删除</RadioButton> */}
</RadioGroup>
<Select
allowClear
showSearch
optionFilterProp="children"
placeholder="请选择系统"
style={{ width: 200, marginRight: 10, marginBottom: 10 }}
onChange={sysId => setParams({ ...innerParams, sysId, current: 1 }, true)}
>
{(systems || []).map((i: Privilege.SystemListVO) => (<Option value={i.id || 0} key={i.id}>{i.sysName || '--'}</Option>))}
</Select>
<Search
allowClear
placeholder="请输入角色名称"
onChange={(e) => fetchListByName(e.target.value || undefined)}
onSearch={value => setParams({ ...innerParams, roleName: value || undefined, current: 1 }, true)}
style={{ width: 200, marginRight: 10, marginBottom: 10 }}
/>
<Select allowClear placeholder="请选择角色类型" style={{ width: 200, marginRight: 10, marginBottom: 10 }} onChange={roleType => setParams({ ...innerParams, roleType, current: 1 }, true)}>
{[1, 2, 3].map((item) => (
<Option key={item} value={item}>
{RoleTypeEnum[item]}
</Option>
))}
</Select>
<Select allowClear placeholder="请选择角色用途" style={{ width: 200, marginRight: 10, marginBottom: 10 }} onChange={useType => setParams({ ...innerParams, useType, current: 1 }, true)}>
{[1, 2, 3, 4].map(item => (
<Option key={item} value={item}>
{UseTypeEnum[item]}
</Option>
))}
</Select>
</Row>
)
}