fix: Show the number of filters

This commit is contained in:
chenos 2020-12-30 12:02:02 +08:00
parent c20d3a91de
commit 2e35947dae
3 changed files with 10 additions and 2 deletions

View File

@ -8,7 +8,7 @@ export function Filter(props) {
const drawerRef = useRef<any>(); const drawerRef = useRef<any>();
const [visible, setVisible] = useState(false); const [visible, setVisible] = useState(false);
const { title, viewName, collection_name } = props.schema; const { title, viewName, collection_name } = props.schema;
const { activeTab = {}, item = {}, associatedName, associatedKey } = props; const { filterCount, activeTab = {}, item = {}, associatedName, associatedKey } = props;
const { associationField } = activeTab; const { associationField } = activeTab;
const params = {}; const params = {};
@ -53,7 +53,7 @@ export function Filter(props) {
> >
<Button icon={<FilterOutlined />} onClick={() => { <Button icon={<FilterOutlined />} onClick={() => {
setVisible(true); setVisible(true);
}}>{title}</Button> }}>{filterCount ? `${filterCount}${title}` : title}</Button>
</Popover> </Popover>
</> </>
) )

View File

@ -31,6 +31,7 @@ export function SimpleTable(props: SimpleTableProps) {
const { rowKey = 'id', name: viewName, actionDefaultParams = {}, fields = [], rowViewName, actions = [], paginated = true, defaultPerPage = 10 } = schema; const { rowKey = 'id', name: viewName, actionDefaultParams = {}, fields = [], rowViewName, actions = [], paginated = true, defaultPerPage = 10 } = schema;
const { sourceKey = 'id' } = activeTab.field||{}; const { sourceKey = 'id' } = activeTab.field||{};
const drawerRef = useRef<any>(); const drawerRef = useRef<any>();
const [filterCount, setFilterCount] = useState(0);
const name = associatedName ? `${associatedName}.${resourceName}` : resourceName; const name = associatedName ? `${associatedName}.${resourceName}` : resourceName;
const { data, loading, pagination, mutate, refresh, params, run } = useRequest((params = {}) => { const { data, loading, pagination, mutate, refresh, params, run } = useRequest((params = {}) => {
const { current, pageSize, sorter, filter, ...restParams } = params; const { current, pageSize, sorter, filter, ...restParams } = params;
@ -78,12 +79,15 @@ export function SimpleTable(props: SimpleTableProps) {
{...props} {...props}
style={{ marginBottom: 14 }} style={{ marginBottom: 14 }}
actions={actions} actions={actions}
filterCount={filterCount}
onFinish={() => { onFinish={() => {
refresh(); refresh();
}} }}
onTrigger={{ onTrigger={{
async filter(values) { async filter(values) {
console.log('filter', values); console.log('filter', values);
const items = values.filter.and || values.filter.or;
setFilterCount(Object.keys(items).length);
// @ts-ignore // @ts-ignore
run({...params[0], filter: values.filter}); run({...params[0], filter: values.filter});
}, },

View File

@ -30,6 +30,7 @@ export function Table(props: TableProps) {
// const { data, mutate } = useRequest(() => api.resource(name).list({ // const { data, mutate } = useRequest(() => api.resource(name).list({
// associatedKey, // associatedKey,
// })); // }));
const [filterCount, setFilterCount] = useState(0);
const name = associatedName ? `${associatedName}.${resourceName}` : resourceName; const name = associatedName ? `${associatedName}.${resourceName}` : resourceName;
const { data, loading, pagination, mutate, refresh, run, params } = useRequest((params = {}, ...args) => { const { data, loading, pagination, mutate, refresh, run, params } = useRequest((params = {}, ...args) => {
const { current, pageSize, sorter, filter, ...restParams } = params; const { current, pageSize, sorter, filter, ...restParams } = params;
@ -78,6 +79,7 @@ export function Table(props: TableProps) {
<Card bordered={false}> <Card bordered={false}>
<Actions <Actions
{...props} {...props}
filterCount={filterCount}
style={{ marginBottom: 14 }} style={{ marginBottom: 14 }}
actions={actions} actions={actions}
onFinish={() => { onFinish={() => {
@ -85,6 +87,8 @@ export function Table(props: TableProps) {
}} }}
onTrigger={{ onTrigger={{
async filter(values) { async filter(values) {
const items = values.filter.and || values.filter.or;
setFilterCount(Object.keys(items).length);
// @ts-ignore // @ts-ignore
run({...params[0], filter: values.filter}); run({...params[0], filter: values.filter});
console.log('filter', values); console.log('filter', values);