|
@@ -1,7 +1,7 @@
|
|
|
import CustomListModel from '@/components/CustomList'
|
|
|
import Tables from '@/components/Tables'
|
|
|
import { quanpin } from '@/utils/fullScreen'
|
|
|
-import { FullscreenExitOutlined, FullscreenOutlined, RedoOutlined, SettingOutlined } from '@ant-design/icons'
|
|
|
+import { FullscreenExitOutlined, FullscreenOutlined, RedoOutlined, SettingOutlined, SyncOutlined } from '@ant-design/icons'
|
|
|
import { Button, Card, Col, Row, Space, Spin, Tooltip, } from 'antd'
|
|
|
import { ColumnsType } from 'antd/lib/table'
|
|
|
import React, { useEffect, useRef, useState, useCallback } from 'react'
|
|
@@ -36,12 +36,14 @@ interface Prosp {
|
|
|
}
|
|
|
}) => void,
|
|
|
ajax?: any,//接口刷新
|
|
|
+ syncAjax?:any,//同步
|
|
|
hoverable?: boolean,
|
|
|
- rowSelection?: any
|
|
|
+ rowSelection?: any,
|
|
|
+ myKey?:any,//自定义使用哪个值做key
|
|
|
}
|
|
|
|
|
|
function TableData(props: Prosp) {
|
|
|
- const { isZj, scroll, columns, title, dataSource, expandedRowRender, className, leftChild, page = undefined, rowSelection = false, pageSize = undefined, size = 'small', total = 0, loading = false, onChange, config, configName, ajax, hoverable = true } = props
|
|
|
+ const { isZj, scroll, columns, title, dataSource, expandedRowRender, className, leftChild, page = undefined, rowSelection = false, pageSize = undefined, size = 'small', total = 0, loading = false, onChange, config, configName, ajax,syncAjax, hoverable = true ,myKey} = props
|
|
|
const { state: userState } = useModel('useOperating.useUser')
|
|
|
const { isFell } = userState
|
|
|
const [visible, setVisible] = useState<boolean>(false)
|
|
@@ -129,29 +131,43 @@ function TableData(props: Prosp) {
|
|
|
{leftChild}
|
|
|
</Space>
|
|
|
{/*紧凑*/}
|
|
|
- <Space style={{ float: 'right' }}>
|
|
|
+ <div style={{ float: 'right',display:'flex',flexFlow:'row' }}>
|
|
|
{
|
|
|
ajax && <Button
|
|
|
size='small'
|
|
|
type='text'
|
|
|
+ style={{display:'flex',alignItems:'center'}}
|
|
|
onClick={() => {
|
|
|
ajax.refresh()
|
|
|
}}>
|
|
|
<span style={{ fontSize: 10, color: '#999' }}>刷新时间:{ajax?.data?.reqTime}</span>
|
|
|
- <Tooltip title='刷新'><RedoOutlined /></Tooltip>
|
|
|
+ <Tooltip title='刷新'><RedoOutlined style={{color:'#2196f3',fontSize:17}}/></Tooltip>
|
|
|
+ </Button>
|
|
|
+ }
|
|
|
+ {
|
|
|
+ syncAjax && <Button
|
|
|
+ size='small'
|
|
|
+ type='text'
|
|
|
+ style={{display:'flex',alignItems:'center'}}
|
|
|
+ onClick={() => {
|
|
|
+ syncAjax()
|
|
|
+ }}>
|
|
|
+ <Tooltip title='同步最新'><SyncOutlined style={{color:'red',fontSize:17}}/></Tooltip>
|
|
|
</Button>
|
|
|
}
|
|
|
{config && <Button
|
|
|
size='small'
|
|
|
type='text'
|
|
|
+ style={{display:'flex',alignItems:'center'}}
|
|
|
onClick={() => {
|
|
|
setVisible(true)
|
|
|
}}>
|
|
|
- <Tooltip title='设置'><SettingOutlined /></Tooltip>
|
|
|
+ <Tooltip title='设置'><SettingOutlined style={{fontSize:17}}/></Tooltip>
|
|
|
</Button>}
|
|
|
<Button
|
|
|
type='text'
|
|
|
size='small'
|
|
|
+ style={{display:'flex',alignItems:'center'}}
|
|
|
onClick={() => {
|
|
|
if (ref?.current) {
|
|
|
quanpin(ref?.current)
|
|
@@ -162,7 +178,7 @@ function TableData(props: Prosp) {
|
|
|
}
|
|
|
</Button>
|
|
|
{visible && <CustomListModel version={version} config={config} configName={configName} visible={visible} onClose={() => { setVisible(false) }} onChange={(arr: any) => { setSelectData(arr) }} columns={newColumns?.length > 0 ? newColumns : columns()} />}
|
|
|
- </Space>
|
|
|
+ </div>
|
|
|
</Col>
|
|
|
</Row>
|
|
|
</Col>
|
|
@@ -176,7 +192,7 @@ function TableData(props: Prosp) {
|
|
|
>
|
|
|
<Row gutter={[0, 20]}>
|
|
|
{header}
|
|
|
- <Tab {...{ size, newColumns, handelResize, className, isZj, rowSelection, columns, loading, scroll, isFell, page, pageSize, dataSource, onChange, expandedRowRender, total, ajax }} />
|
|
|
+ <Tab {...{ size, newColumns, handelResize, className, isZj, rowSelection, columns, loading, scroll, isFell, page, pageSize, dataSource, onChange, expandedRowRender, total, ajax ,myKey}} />
|
|
|
</Row>
|
|
|
</Card>
|
|
|
</Col>
|
|
@@ -188,7 +204,7 @@ function TableData(props: Prosp) {
|
|
|
|
|
|
/**表格 */
|
|
|
const Tab = React.memo((props: any) => {
|
|
|
- const { size, newColumns, className, handelResize, columns, scroll, loading, rowSelection, isFell, page, pageSize, dataSource, onChange, expandedRowRender, total, ajax } = props
|
|
|
+ const { size, newColumns, className, handelResize, columns, scroll, loading, rowSelection, isFell, page, pageSize, dataSource, onChange, expandedRowRender, total, ajax ,myKey} = props
|
|
|
return < Col span={24} >
|
|
|
<div className={`${style[size]} ${className ? style[className] : ''} `}>
|
|
|
{dataSource || !ajax?.loading ? <Tables
|
|
@@ -209,6 +225,7 @@ const Tab = React.memo((props: any) => {
|
|
|
defaultPageSize={20}
|
|
|
rowSelection={rowSelection}
|
|
|
handelResize={((columns: any) => handelResize(columns))}
|
|
|
+ myKey={myKey}
|
|
|
/> : <div className={style.example}>
|
|
|
<Spin />
|
|
|
</div>}
|