import React, { useState, useEffect } from 'react';
import { connect } from 'umi';
import { Card, Button } from 'antd';
import FormModal from '@/components/FormModal';
import CardList from '@/components/CardList';

const HCZJ = (props) => {
  const {
    id,
    sysToken,
    fetchHCZJtable,
    fetchAddHCZJ,
    fetchEditHCZJ,
    fetchDeleteHCZJ,
    onlyRead,
  } = props;
  const [visible, setVisible] = useState(false);
  const [dataList, setDataList] = useState([]);

  const getTable = () => {
    fetchHCZJtable({ pfId: id, sysToken }).then((res) => {
      if (res) {
        setDataList(res);
      }
    });
  };

  useEffect(() => {
    getTable();
  }, []);

  const handleOpenModal = () => {
    setVisible(true);
  };
  const handleCloseModal = () => {
    setVisible(false);
  };
  return (
    <Card title="核查证据">
      {
        !onlyRead &&
        <div className="rightButton">
          <Button type="primary" onClick={handleOpenModal} >
            上传核查证据
        </Button>
        </div>
      }
      <div>
        <CardList
          onlyRead={onlyRead}
          sourceType={'zj'}
          dataSource={dataList}
          fetchDeleteHCZJ={fetchDeleteHCZJ}
          fetchEditHCZJ={fetchEditHCZJ}
          getTable={getTable}
          sysToken={sysToken}
        />
      </div>
      {visible && (
        <FormModal
          visible={visible}
          id={id}
          sysToken={sysToken}
          handleClose={handleCloseModal}
          sourceType={'zj'}
          actionType={'add'}
          fetchAddHCZJ={fetchAddHCZJ}
          getTable={getTable}
        />
      )}
    </Card>
  );
};

const mapStateToProps = ({ doing }) => ({
  ...doing,
});
const mapDispatchToProps = (dispatch) => ({
  fetchHCZJtable(params) {
    return dispatch({ type: 'doing/fetchHCZJtable', payload: { ...params } });
  },
  fetchAddHCZJ(params) {
    return dispatch({ type: 'doing/fetchAddHCZJ', payload: { ...params } });
  },
  fetchEditHCZJ(params) {
    return dispatch({ type: 'doing/fetchEditHCZJ', payload: { ...params } });
  },
  fetchDeleteHCZJ(params) {
    return dispatch({ type: 'doing/fetchDeleteHCZJ', payload: { ...params } });
  },
});
export default connect(mapStateToProps, mapDispatchToProps)(HCZJ);
