mcfxkh-Web/src/views/Home/InfoDlg/SyjcDlg/index.js

import React,{useState} from 'react';

import Dialog from '@material-ui/core/Dialog';
import DialogContent from '@material-ui/core/DialogContent';
import DpPaperComponent from '../../../../layouts/mui/DpPaperCompanent';
import DpTabs from '../../../../layouts/mui/DpTabs';
import DpTab from '../../../../layouts/mui/DpTab';
import RzSearch from '../../components/RzSearch';
import DpAppBar from '../../../../layouts/mui/DpAppBar';
import DpBackgroundDrop from '../../../../layouts/mui/DpBackdrop';
import DpCloseButton from '../../../../layouts/mui/DpCloseButton';
import DrpSearch from '../../components/DrpSearch';
import DrpStAround from '../../components/DrpStAround';
import GqJcsj from '../../components/Hdjcsj'
import Table from './table'
import ModalView from './view'
import { makeStyles } from '@material-ui/core/styles';
function HDStDlg({ record, onClose }) {
  const useStyles = makeStyles((theme) => ({
     
      addButton: {
        backgroundColor: '#1f6feb',
        color: '#ffffff',
        border: 'none',
        padding: '0px 12px',
        borderRadius: 6,
        marginTop: 6,
        marginRight:20,
        height:35,
        cursor: 'pointer',
        '&:hover': {
          backgroundColor: '#388bfd',
        },
      },
    }));
    const classes = useStyles();
  const [value, setValue] = React.useState(0);
      const [visible, setVisible] = useState(false)
  
  return (
    <Dialog
      open={true}
      onClose={onClose}
      maxWidth="xl"
      style={{ borderRadius: 0 }}
      PaperComponent={DpPaperComponent}
      BackdropComponent={DpBackgroundDrop}
    >
      <div className="boxhead"></div>
      <DialogContent style={{ padding: 0, width: '80rem', overflowX: 'hidden' }}>
        <DpAppBar position="sticky">
          <DpTabs value={value} indicatorColor="primary" onChange={(_, v) => setValue(v)}>
            <DpTab label={record.res_nm+'-'+record.cd_nm} />
          </DpTabs>
              <button className={classes.addButton} onClick={()=>setVisible(true)}>所在断面浸润线</button>
          <DpCloseButton onClick={onClose} />
        </DpAppBar>
        <div style={{ padding: '2rem', hminHeight: '50rem',maxHeight: '60rem' }}>
          <Table/>
        </div>

      </DialogContent>
      <div className="boxfoot"></div>
       <ModalView
                    open={visible}
                    onClose={() => setVisible(false)}
                  ></ModalView>
    </Dialog>
  )
}

export default React.memo(HDStDlg);