123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237 |
- import React, { useEffect, useState } from 'react'
- import Helmet from 'react-helmet'
- import Container, { ContainerBody } from 'components/Container'
- import Box from 'components/Box'
- import {
- Button,
- Col,
- Divider,
- Icon,
- message,
- Popconfirm,
- Row,
- Table,
- Tooltip
- } from 'antd'
- import { ColumnProps } from 'antd/lib/table'
- import { compose } from 'redux'
- import request from 'utils/request'
- import api from 'utils/api'
- import DictDatasModal from 'containers/DataManagerDictionary/components/DictDatasModal'
- import { IDictType } from 'containers/DataManagerDictionary/types'
- import DictTypeFormModal from 'containers/DataManagerDictionary/components/DictTypeFormModal'
- function DataDictionary() {
- const [tableLoading, setTableLoading] = useState(false)
- const [dictTypes, setDictTypes] = useState<IDictType[]>([])
- const [visible, setVisible] = useState(false)
- const [dictType, setDictType] = useState<string>(null)
- const [dictTypeFormVisible, setDictTypeFormVisible] = useState(false)
- const [dictTypeFormLoading, setDictTypeFormLoading] = useState(false)
- const [dictTypeForm, setDictTypeForm] = useState<IDictType>(null)
- const tableColumns: Array<ColumnProps<IDictType>> = [
- {
- title: '字典主键',
- dataIndex: 'dictId'
- },
- {
- title: '字典名称',
- dataIndex: 'dictName'
- },
- {
- title: '字典类型',
- dataIndex: 'dictType'
- },
- {
- title: '状态',
- dataIndex: 'status',
- render: (text) => (
- <>
- {text === 0 && (
- <span
- style={{ padding: '2px 4px', background: 'green', color: '#fff' }}
- >
- 正常
- </span>
- )}
- {text === 1 && (
- <span
- style={{ padding: '2px 4px', background: 'red', color: '#fff' }}
- >
- 停用
- </span>
- )}
- </>
- )
- },
- {
- title: '备注',
- dataIndex: 'remark'
- },
- {
- title: '创建时间'
- // dataIndex: 'isDefault'
- },
- {
- title: '操作',
- render: (_, data) => (
- <>
- <a
- onClick={() => {
- setDictTypeFormVisible(true)
- setDictTypeForm(data)
- }}
- >
- 编辑
- </a>
- <Divider type="vertical" />
- <a
- onClick={() => {
- setDictType(data.dictType)
- setVisible(true)
- }}
- >
- 列表
- </a>
- <Divider type="vertical" />
- <Popconfirm
- title="确定删除?"
- placement="bottom"
- onConfirm={() => handleDeleteDictType(data.dictId)}
- >
- <a>删除</a>
- </Popconfirm>
- </>
- )
- }
- ]
- const queryDictTypes = async () => {
- try {
- setTableLoading(true)
- const data = await request(api.dictTypes, { method: 'GET' })
- // @ts-ignore
- setDictTypes(data?.payload ?? [])
- } finally {
- setTableLoading(false)
- }
- }
- const handleDeleteDictType = async (dictId) => {
- try {
- setTableLoading(true)
- await request(`${api.deleteDictType}/${dictId}`, { method: 'delete' })
- queryDictTypes()
- } finally {
- setTableLoading(false)
- }
- }
- const handleSaveDictType = async (dt: IDictType) => {
- // // 0=正常,1=停用
- try {
- setDictTypeFormLoading(true)
- const url = dictTypeForm?.dictId
- ? `${api.updateDictType}/${dictTypeForm.dictId}`
- : api.createDictType
- const result = await request(url, {
- method: dictTypeForm?.dictId ? 'PUT' : 'POST',
- data: { ...(dictTypeForm ?? {}), ...dt, status: dt.status ? 0 : 1 }
- })
- // @ts-ignore
- if (result.header.code === 200) {
- setDictTypeFormVisible(false)
- queryDictTypes()
- } else {
- // @ts-ignore
- // tslint:disable-next-line:no-unused-expression
- result.header.msg && message.error({ content: result.header.msg })
- }
- } finally {
- setDictTypeFormLoading(false)
- }
- }
- useEffect(() => {
- queryDictTypes()
- }, [])
- return (
- <Container>
- <Helmet title="数据字典" />
- <ContainerBody>
- <Box>
- <Box.Header>
- <Box.Title>
- <Icon type="bars" />
- 数据字典列表
- </Box.Title>
- <Box.Tools>
- <Tooltip placement="bottom" title="新增">
- <Button
- type="primary"
- icon="plus"
- onClick={() => {
- setDictTypeFormVisible(true)
- setDictTypeForm(null)
- }}
- />
- </Tooltip>
- </Box.Tools>
- </Box.Header>
- <Box.Body>
- <Row>
- <Col span={24}>
- <Table
- bordered
- rowKey="dictId"
- loading={tableLoading}
- dataSource={dictTypes}
- columns={tableColumns}
- pagination={false}
- // onChange={this.tableChange}
- />
- <div style={{ height: 20 }} />
- </Col>
- </Row>
- </Box.Body>
- </Box>
- </ContainerBody>
- <DictDatasModal
- visible={visible}
- dictType={dictType}
- onCancel={() => setVisible(false)}
- />
- <DictTypeFormModal
- visible={dictTypeFormVisible}
- loading={dictTypeFormLoading}
- fromView={dictTypeForm}
- onSave={handleSaveDictType}
- onCancel={() => setDictTypeFormVisible(false)}
- />
- </Container>
- )
- }
- // const mapDispatchToProps = (dispatch: Dispatch<ViewActionType>) => ({
- // onLoadViews: (projectId) => dispatch(ViewActions.loadViews(projectId)),
- // onDeleteView: (viewId, resolve) => dispatch(ViewActions.deleteView(viewId, resolve)),
- // onCopyView: (view, resolve) => dispatch(ViewActions.copyView(view, resolve)),
- // onCheckName: (data, resolve, reject) => dispatch(checkNameUniqueAction('view', data, resolve, reject))
- // })
- //
- // const mapStateToProps = createStructuredSelector({
- // views: makeSelectViews(),
- // currentProject: makeSelectCurrentProject(),
- // loading: makeSelectLoading()
- // })
- // const withConnect = connect<IViewListStateProps, IViewListDispatchProps, RouteComponentWithParams>(mapStateToProps, mapDispatchToProps)
- // const withReducer = injectReducer({ key: 'view', reducer })
- // const withSaga = injectSaga({ key: 'view', saga: sagas })
- export default compose()(DataDictionary)
- // withReducer,
- // withSaga,
- // withConnect
|