Filter.tsx 2.68 KB
import React, { useState, useEffect, useCallback } from "react";
import { Table, Row, Input, Select } from "antd";
// import { ApprovalType, Approval_Status } from "../entity";
import _ from "lodash";
import usePagination from "@/hooks/usePagination";
import { systemListApi } from "@/pages/admin/Privilege/api";

const { Option } = Select;
interface Props {
  setParams: any;
  // tempData: any;
  roleList: CommonApi.RoleCodeVO[];
}

export default function Filter({ setParams, roleList }: Props) {
  const { list: syslist } = usePagination(systemListApi, {
    current: 1,
    pageSize: 500,
  });

  const seachOnchange = useCallback(
    _.debounce((param) => {
      setParams({ ...param }, true);
    }, 800),
    [setParams]
  );
  const enableList = [
    { value: 0, label: "禁用" },
    { value: 1, label: "启用" },
  ];

  //根据系统名称搜索
  const _onChangeSys = (value: any) => {
    setParams({ ...value, current: 1 }, true);
  };

  return (
    <Row justify="start" style={{ marginBottom: 20 }}>
      <Input.Search
        allowClear
        placeholder="请输入指标名称或编码"
        onSearch={(value) => {
          setParams({ keyword: value }, true);
        }}
        onChange={(e) => {
          seachOnchange({ keyword: e.target.value });
        }}
        style={{ width: 250, marginRight: 10, marginBottom: 10 }}
      />

      <Select
        allowClear
        placeholder="请选择角色"
        style={{ width: 250, marginRight: 10, marginBottom: 10 }}
        onChange={(value) => {
          setParams({ roleCode: value }, true);
        }}
        showSearch
        optionFilterProp="children"
      >
        {roleList.map((item) => (
          <Option value={item.roleCode} key={item.roleCode}>
            {item.roleName}
          </Option>
        ))}
      </Select>
      {/* <Select
        allowClear
        placeholder="选择归属系统"
        style={{ width: 260, marginRight: 5 }}
        onChange={(value: any) => _onChangeSys({ sysId: value })}
        showSearch
        optionFilterProp="children"
      >
        {syslist.map((item) => (
          <Select.Option value={item.id!} key={item.id}>
            {item.sysName}
          </Select.Option>
        ))}
      </Select> */}
      <Select
        placeholder="筛选禁用与启用"
        style={{ width: 250, marginRight: 10, marginBottom: 10 }}
        onChange={(value) => {
          setParams({ enable: value }, true);
        }}
        showSearch
        optionFilterProp="children"
        defaultValue={1}
      >
        {enableList.map((item) => (
          <Option value={item.value} key={item.value}>
            {item.label}
          </Option>
        ))}
      </Select>
    </Row>
  );
}