index.tsx 2.9 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091
  1. import React, { useEffect, useState } from 'react'
  2. import Helmet from 'react-helmet'
  3. import Container, { ContainerBody } from 'components/Container'
  4. import Box from 'components/Box'
  5. import { Col, Icon, Row, Table, Tooltip } from 'antd'
  6. import { PaginationConfig } from 'antd/lib/table'
  7. import { compose } from 'redux'
  8. function DataDictionary() {
  9. const [screenWidth, setScreenWidth] = useState(
  10. document.documentElement.clientWidth
  11. )
  12. const handleSetScreenWidth = () => {
  13. setScreenWidth(document.documentElement.clientWidth)
  14. }
  15. const basePagination: PaginationConfig = {
  16. defaultPageSize: 20,
  17. showSizeChanger: true
  18. }
  19. const tablePagination: PaginationConfig = {
  20. ...basePagination,
  21. simple: screenWidth <= 768
  22. }
  23. useEffect(() => {
  24. window.addEventListener('resize', handleSetScreenWidth, false)
  25. return () =>
  26. window.removeEventListener('resize', handleSetScreenWidth, false)
  27. }, [])
  28. return (
  29. <Container>
  30. <Helmet title="数据字典" />
  31. <ContainerBody>
  32. <Box>
  33. <Box.Header>
  34. <Box.Title>
  35. <Icon type="bars" />
  36. 数据字典列表
  37. </Box.Title>
  38. <Box.Tools>
  39. <Tooltip placement="bottom" title="新增">
  40. {/* <AdminButton */}
  41. {/* type="primary" */}
  42. {/* icon="plus" */}
  43. {/* onClick={this.addView} */}
  44. {/* /> */}
  45. </Tooltip>
  46. </Box.Tools>
  47. </Box.Header>
  48. <Box.Body>
  49. <Row>
  50. <Col span={24}>
  51. <Table
  52. bordered
  53. rowKey="id"
  54. // loading={loading.view}
  55. // dataSource={filterViews}
  56. // columns={tableColumns}
  57. pagination={tablePagination}
  58. // onChange={this.tableChange}
  59. />
  60. </Col>
  61. </Row>
  62. </Box.Body>
  63. </Box>
  64. </ContainerBody>
  65. </Container>
  66. )
  67. }
  68. // const mapDispatchToProps = (dispatch: Dispatch<ViewActionType>) => ({
  69. // onLoadViews: (projectId) => dispatch(ViewActions.loadViews(projectId)),
  70. // onDeleteView: (viewId, resolve) => dispatch(ViewActions.deleteView(viewId, resolve)),
  71. // onCopyView: (view, resolve) => dispatch(ViewActions.copyView(view, resolve)),
  72. // onCheckName: (data, resolve, reject) => dispatch(checkNameUniqueAction('view', data, resolve, reject))
  73. // })
  74. //
  75. // const mapStateToProps = createStructuredSelector({
  76. // views: makeSelectViews(),
  77. // currentProject: makeSelectCurrentProject(),
  78. // loading: makeSelectLoading()
  79. // })
  80. // const withConnect = connect<IViewListStateProps, IViewListDispatchProps, RouteComponentWithParams>(mapStateToProps, mapDispatchToProps)
  81. // const withReducer = injectReducer({ key: 'view', reducer })
  82. // const withSaga = injectSaga({ key: 'view', saga: sagas })
  83. export default compose()(DataDictionary)
  84. // withReducer,
  85. // withSaga,
  86. // withConnect