Enhance ObjectTable component to support Electron context; adjust scroll height based on Electron environment and improve action button handling with dynamic disabled state.
This commit is contained in:
parent
f0cb4b3b83
commit
5300874b80
@ -39,7 +39,8 @@ import CheckIcon from '../../Icons/CheckIcon'
|
|||||||
import { useNavigate } from 'react-router-dom'
|
import { useNavigate } from 'react-router-dom'
|
||||||
import QuestionCircleIcon from '../../Icons/QuestionCircleIcon'
|
import QuestionCircleIcon from '../../Icons/QuestionCircleIcon'
|
||||||
import { AuthContext } from '../context/AuthContext'
|
import { AuthContext } from '../context/AuthContext'
|
||||||
import unionBy from 'lodash/unionBy'
|
import { ElectronContext } from '../context/ElectronContext'
|
||||||
|
|
||||||
const logger = loglevel.getLogger('DasboardTable')
|
const logger = loglevel.getLogger('DasboardTable')
|
||||||
logger.setLevel(config.logLevel)
|
logger.setLevel(config.logLevel)
|
||||||
|
|
||||||
@ -58,6 +59,7 @@ const ObjectTable = forwardRef(
|
|||||||
ref
|
ref
|
||||||
) => {
|
) => {
|
||||||
const { token } = useContext(AuthContext)
|
const { token } = useContext(AuthContext)
|
||||||
|
const { isElectron } = useContext(ElectronContext)
|
||||||
const {
|
const {
|
||||||
fetchObjects,
|
fetchObjects,
|
||||||
connected,
|
connected,
|
||||||
@ -73,6 +75,15 @@ const ObjectTable = forwardRef(
|
|||||||
if (cards) {
|
if (cards) {
|
||||||
adjustedScrollHeight = 'calc(var(--unit-100vh) - 280px)'
|
adjustedScrollHeight = 'calc(var(--unit-100vh) - 280px)'
|
||||||
}
|
}
|
||||||
|
if (isElectron) {
|
||||||
|
adjustedScrollHeight = 'calc(var(--unit-100vh) - 244px)'
|
||||||
|
}
|
||||||
|
if (isMobile && isElectron) {
|
||||||
|
adjustedScrollHeight = 'calc(var(--unit-100vh) - 282px)'
|
||||||
|
}
|
||||||
|
if (cards && isElectron) {
|
||||||
|
adjustedScrollHeight = 'calc(var(--unit-100vh) - 260px)'
|
||||||
|
}
|
||||||
const [, contextHolder] = message.useMessage()
|
const [, contextHolder] = message.useMessage()
|
||||||
const tableRef = useRef(null)
|
const tableRef = useRef(null)
|
||||||
const model = getModelByName(type)
|
const model = getModelByName(type)
|
||||||
@ -108,26 +119,37 @@ const ObjectTable = forwardRef(
|
|||||||
const renderActions = (objectData) => {
|
const renderActions = (objectData) => {
|
||||||
return (
|
return (
|
||||||
<Flex gap='small' align='center' justify='center'>
|
<Flex gap='small' align='center' justify='center'>
|
||||||
{rowActions.map((action, index) => (
|
{rowActions.map((action, index) => {
|
||||||
<Tooltip key={index} title={action.label} arrow={false}>
|
var disabled = false
|
||||||
<Button
|
if (action.disabled) {
|
||||||
icon={
|
if (typeof action.disabled === 'function') {
|
||||||
action.icon ? (
|
disabled = action.disabled(objectData)
|
||||||
createElement(action.icon)
|
} else {
|
||||||
) : (
|
disabled = action.disabled
|
||||||
<QuestionCircleIcon />
|
}
|
||||||
)
|
}
|
||||||
}
|
return (
|
||||||
type={'text'}
|
<Tooltip key={index} title={action.label} arrow={false}>
|
||||||
size={'small'}
|
<Button
|
||||||
onClick={() => {
|
icon={
|
||||||
if (action.url) {
|
action.icon ? (
|
||||||
navigate(action.url(objectData._id))
|
createElement(action.icon)
|
||||||
|
) : (
|
||||||
|
<QuestionCircleIcon />
|
||||||
|
)
|
||||||
}
|
}
|
||||||
}}
|
disabled={disabled}
|
||||||
/>
|
type={'text'}
|
||||||
</Tooltip>
|
size={'small'}
|
||||||
))}
|
onClick={() => {
|
||||||
|
if (action.url) {
|
||||||
|
navigate(action.url(objectData._id))
|
||||||
|
}
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
</Tooltip>
|
||||||
|
)
|
||||||
|
})}
|
||||||
</Flex>
|
</Flex>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
@ -289,11 +311,12 @@ const ObjectTable = forwardRef(
|
|||||||
const updateEventHandler = useCallback((id, updatedData) => {
|
const updateEventHandler = useCallback((id, updatedData) => {
|
||||||
setPages((prevPages) =>
|
setPages((prevPages) =>
|
||||||
prevPages.map((page) => {
|
prevPages.map((page) => {
|
||||||
const updatedItems = unionBy(
|
const updatedItems = page.items.map((item) => {
|
||||||
[{ ...updatedData, _id: id }],
|
if (item._id === id) {
|
||||||
page.items,
|
return { ...item, ...updatedData }
|
||||||
'_id'
|
}
|
||||||
)
|
return item
|
||||||
|
})
|
||||||
return {
|
return {
|
||||||
...page,
|
...page,
|
||||||
items: updatedItems
|
items: updatedItems
|
||||||
@ -748,6 +771,7 @@ const ObjectTable = forwardRef(
|
|||||||
onChange={handleTableChange}
|
onChange={handleTableChange}
|
||||||
showSorterTooltip={false}
|
showSorterTooltip={false}
|
||||||
style={{ height: '100%' }}
|
style={{ height: '100%' }}
|
||||||
|
size={isElectron ? 'small' : 'middle'}
|
||||||
/>
|
/>
|
||||||
{cards ? (
|
{cards ? (
|
||||||
<Spin indicator={<LoadingOutlined />} spinning={loading}>
|
<Spin indicator={<LoadingOutlined />} spinning={loading}>
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user